无法使用 ng-route 将数据从控制器获取到视图中答案

【问题标题】：Unable to fetch data from controller into view using ng-route无法使用 ng-route 将数据从控制器获取到视图中
【发布时间】：2019-04-30 09:32:04
【问题描述】：

控制器部分

以下是控制器部分，这里我无法将控制器aa和bb的数据分别提取到html页面学生和课程中

/// <reference path="Angularmin.js" />
/// <reference path="angular_route.js" />
/// <reference path="C:\Users\prerna.bhadwal\Documents\projects\practice_angular\practice_angular\HtmlPage2.html"


var app = angular.module('mod', ['ngRoute']);

//var app = angular.module('mod', []);
app.config(function ($routeProvider) {
 $routeProvider

 .when("/Students", {
     templateUrl: "Templates/Courses.html",
     controller:"aa"
 })
 .when("/Courses", {
     templateUrl: "Templates/Students.html",
     controller: "bb"
 })
})
 .controller("aa", function ($scope) {

 $scope.msg = "hello how r";
}).controller("bb", function ($scope) {

 $scope.msg1 = "hhhhhh";

})

Html 页面部分

这是我路由到学生和课程 html 页面的 html 部分：

 <!DOCTYPE HTML>
 <html ng-app="mod">
 <head>
     <!--<script src="Scripts/Controller2.js"></script>-->
 
     <script src="Scripts/Angularmin.js"></script>
     <script src="Scripts/Controller.js"></script>
     <script src="Scripts/angular_route.js"></script>
 
     <title></title>
 </head>
 <body >
     <!--<a href="#/Students">students</a>
         <a href="#/Courses">courses</a>-->
     <!--<div>
        {{datafromservice}} datafromservice
     </div>-->-->
 
 
     <a href="#/Students">Red</a>
     <a href="#Courses">Green</a>
 
 
     <div ng-view></div>
 </body>
 </html>

这是学生的html页面：

 <div>
     <ul>
         <li>Student class A</li>
         <li>Student Class B</li>
         <li>{{msg}}</li>
     </ul>
 </div>

这是课程的html页面：

 <div>
     <ul>
         <li>Maths</li>
         <li>Science</li>
         <li>{{msg1}}</li>
     </ul>
 </div>

【问题讨论】：

` Green`这不是错字吗？
检查这个以了解如何在路由时传递值...stackoverflow.com/questions/27533386/…

标签： javascript angularjs angular ngroute

【解决方案1】：

我认为这就是您正在尝试的... 将值传递到路由中...

sn-p...和students.htm中的完整代码，请插入以下行...

将其插入您的...students.htm

 <li>{{gottenValue}}</li>

var app = angular.module('mod', ['ngRoute']);

//var app = angular.module('mod', []);
app.config(function ($routeProvider) {
 $routeProvider
  .when("/Students", {
     templateUrl: "students.htm",
     controller:"aa",
     passValue: 'exampleA'
 })
 .when("/Courses", {
     templateUrl: "rootScope.htm",
     controller: "myCtrl"
 })
})
 .controller("aa", function ($scope, $route) {
    $scope.msg = "hello how r u ";
    $scope.gottenValue = $route.current.$$route.passValue;
    console.log($scope.gottenValue);

    $scope.passValue
}).controller("bb", function ($scope) {
 $scope.msg1 = "hhhhhh";
});

        <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.9/angular.min.js"></script>
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.9/angular-route.js"></script>
    
    <div ng-app="mod">
       <!--<a href="#/Students">students</a>
         <a href="#/Courses">courses</a>-->
     <!--<div>
        {{datafromservice}} datafromservice
     </div>-->-->


     <a href="#!Students">Red</a>
     <a href="#!Courses">Green</a>


     <div ng-view></div>
    </div>

【讨论】：