ngroute工作但控制器不工作
问题描述:
ngRoute工作,但我无法在视图中显示模型。 它似乎没有正确检测到控制器。 当我运行这个例子,我得到了下面的结果。 首先用户: 用户名:{{user.username}} 评价:{{user.rating}}ngroute工作但控制器不工作
/* file user.js*/
var app= angular.module('userApp',['ngRoute']);
app.controller('userListController', function($scope){
$scope.users=[
\t {
\t "username": "Bryant",
\t "rating": 37
\t },
\t {
\t "username": "Wells",
\t "rating": 1
\t },
\t {
\t "username": "Sims",
\t "rating": 4
\t },
\t {
\t "username": "Blankenship",
\t "rating": 37
\t },
\t {
\t "username": "Simon",
\t "rating": 11
\t },
\t {
\t "username": "Reyes",
\t "rating": 9
\t },
\t {
\t "username": "Malone",
\t "rating": 17
\t },
\t {
\t "username": "Evans",
\t "rating": 25
\t },
\t {
\t "username": "Keller",
\t "rating": 32
\t }
];
});
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>
\t <li> username: {{ user.username }}</li>
\t <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>
答
您声明ng-app="userApp"
两次(在HTML和BODY)。 也许您需要在BODY中声明ng-controller="userListController"
。
检查控制台输出在加载页面时搜索错误。
+0
是的我复制了ng-app,但是删除重复的ng-app没有解决我的问题,ng-controller的声明被设置为路线提供者:.. when('/ members',{templateUrl:'/members.html',controller:'userListController'})。最后我在控制台中看不到任何错误 – midy62
这样的输出对于应用程序的灾难性故障是典型的。控制台日志说什么? –
顺便说一句,检查这一个。我已经把你的代码放到了缓冲区,并修改了它来显示根目录下的成员视图。它有点有用。所以控制器很好。 [plunker demo](https://plnkr.co/edit/1eVJxGNle53fs4ebU5Ag?p=preview) –
谢谢vladimir,我的控制台没有显示任何错误,我找不到问题 – midy62