Question

ngRoute work但我无法在视图中显示模型。似乎没有正确检测到控制器。当我运行这个例子时，我得到以下结果。第一位用户：用户名：{{user.username}} 评分：{{user.rating}}

/* file user.js*/
var app= angular.module('userApp',['ngRoute']);

app.controller('userListController', function($scope){    

    $scope.users=[
	{
	    "username": "Bryant",
	    "rating": 37
	},
	{
	    "username": "Wells",
	    "rating": 1
	},
	{
	    "username": "Sims",
	    "rating": 4
	},
	{
	    "username": "Blankenship",
	    "rating": 37
	},
	{
	    "username": "Simon",
	    "rating": 11
	},
	{
	    "username": "Reyes",
	    "rating": 9
	},
	{
	    "username": "Malone",
	    "rating": 17
	},
	{
	    "username": "Evans",
	    "rating": 25
	},
	{
	    "username": "Keller",
	    "rating": 32
	}
    ];


});

app.config(function($routeProvider){
    
    $routeProvider.when('/', {templateUrl: '/home.html'}).when('/members', {templateUrl: '/members.html',controller:'userListController'}).otherwise({redirectTo : '/'});

});

<!--file mermbers.html -->
<ul>
    <li ng-repeat="user in users"> First user :
        <ul>
	      <li> username: {{ user.username }}</li>
	      <li>rating :{{ user.rating }}</li>
       </ul>
    </li>
 </ul>

<!-- file index.html-->

<!doctype html>
<html ng-app="userApp">
  <head>
      <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.8/angular.min.js"></script>
      <script src="https://code.angularjs.org/1.5.8/angular-route.min.js"></script>
      <script src="user.js"></script>
 

  </head>
  <body ng-app="userApp">

    
  
      <div ng-view></div>
  </body>
</html>

Answer 1

您要声明ng-app="userApp"两次（在HTML和BODY中）。也许您需要在BODY中声明ng-controller="userListController"。

检查控制台输出，在加载页面时搜索错误。

ngroute工作但Controller无法正常工作

1 个答案: