ng-repeat无法正常工作

你好家伙，所以我运行这个简单的HTML，Angular代码，我不能得到电影标题和URL显示在我的HTML ....但$ scope.test是displayinmg ... 。帮帮我！！ ng-repeat无法正常工作

angular.module('clientApp') 
 
    .controller('MoviesCtrl', function ($scope) { 
 
$scope.test = "tester"; 
 
    $scope.movies = [ 
 
     { 
 
     title:"Green Card", 
 
     url:"https://www.youtube.com/watch?v=_i8C9gO91ts" 
 
     }, 
 
     { 
 
     title: "Fidelawit ፊደላዊት", 
 
     url: "https://www.youtube.com/watch?v=B4u4A7CF3N0" 
 
     }, 
 
     { 
 
     title: "Heran ሔራን", 
 
     url: "https://www.youtube.com/watch?v=_TlRGhOdLJ0" 
 
     }, 
 
     { 
 
     title: "Lela Mafia ሌላ ማፊያ", 
 
     url: "https://www.youtube.com/watch?v=_i8C9gO91ts" 
 
     } 
 
    ]; 
 
    });

<table class="table table-striped"> 
 
    <thead> 
 
    <th>Title</th> 
 
    <th>URL</th> 
 
    </thead> 
 
    <tbody> 
 
     <tr ng-repeat="movie in movies"> 
 
     <td>{{ movie.title }}</td> 
 
     <td>{{ movie.url }}</td> 
 
     </tr> 
 
    </tbody> 
 
</table>

来源

2016-08-17 Harun

奇怪，因为它的工作原理在此琴：https://jsfiddle.net/0dekzcek/ –

添加AngularJS，如果它是你与模块工作的首位，你需要用空括号angular.module('clientApp', [])

angular.module('clientApp', []) 
 
    .controller('MoviesCtrl', function ($scope) { 
 
    $scope.test = "tester"; 
 
    $scope.movies = [ 
 
     { 
 
     title:"Green Card", 
 
     url:"https://www.youtube.com/watch?v=_i8C9gO91ts" 
 
     }, 
 
     { 
 
     title: "Fidelawit ፊደላዊት", 
 
     url: "https://www.youtube.com/watch?v=B4u4A7CF3N0" 
 
     }, 
 
     { 
 
     title: "Heran ሔራን", 
 
     url: "https://www.youtube.com/watch?v=_TlRGhOdLJ0" 
 
     }, 
 
     { 
 
     title: "Lela Mafia ሌላ ማፊያ", 
 
     url: "https://www.youtube.com/watch?v=_i8C9gO91ts" 
 
     } 
 
    ]; 
 
    });

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> 
 
<div ng-app='clientApp' ng-controller='MoviesCtrl'> 
 
    <table class="table table-striped"> 
 
    <thead> 
 
    <th>Title</th> 
 
    <th>URL</th> 
 
    </thead> 
 
    <tbody> 
 
     <tr ng-repeat="(key, movie) in movies"> 
 
     <td>{{ movie.title }}</td> 
 
     <td>{{ movie.url }}</td> 
 
     </tr> 
 
    </tbody> 
 
</table> 
 
</div>

来源

2016-08-17 15:05:19

你可能把它定义忘了加载angular.js。所以，只需将这个文件添加到所有脚本文件的上面。

<script src="angular.min.js"></script>

你可以从这里下载该文件.. https://ajax.googleapis.com/ajax/libs/angularjs/1.5.6/angular.min.js

而且更新angular.module('clientApp')到angular.module('clientApp', [])

因此，修改后的代码看起来就像这样......

控制文件（.js文件）

angular.module('clientApp', []) 
    .controller('MoviesCtrl', function ($scope) { 
    $scope.test = "tester"; 
    $scope.movies = [ 
     { 
     title:"Green Card", 
     url:"https://www.youtube.com/watch?v=_i8C9gO91ts" 
     }, 
     { 
     title: "Fidelawit ፊደላዊት", 
     url: "https://www.youtube.com/watch?v=B4u4A7CF3N0" 
     }, 
     { 
     title: "Heran ሔራን", 
     url: "https://www.youtube.com/watch?v=_TlRGhOdLJ0" 
     }, 
     { 
     title: "Lela Mafia ሌላ ማፊያ", 
     url: "https://www.youtube.com/watch?v=_i8C9gO91ts" 
     } 
    ]; 
    });

HTML文件

<script src="angular.min.js"></script> 
<div ng-app='clientApp' ng-controller='MoviesCtrl'> 
    <table class="table table-striped"> 
    <thead> 
    <th>Title</th> 
    <th>URL</th> 
    </thead> 
    <tbody> 
     <tr ng-repeat="(key, movie) in movies"> 
     <td>{{ movie.title }}</td> 
     <td>{{ movie.url }}</td> 
     </tr> 
    </tbody> 
</table> 
</div>

来源

2016-08-17 15:05:31

的问题似乎并不太大。只有两件事我已经完成

添加到身体来初始化角应用程序。乙

<body ng-app='clientApp'>

新增纳克控制器来表标记

<table class="table table-striped" ng-controller="MoviesCtrl">

然而，这是必须的。必须使[]为零依赖关系。

angular.module('clientApp', [])

这里有云

angular.module('clientApp', []) 
 
    .controller('MoviesCtrl', function ($scope) { 
 
$scope.test = "tester"; 
 
    $scope.movies = [ 
 
     { 
 
     title:"Green Card", 
 
     url:"https://www.youtube.com/watch?v=_i8C9gO91ts" 
 
     }, 
 
     { 
 
     title: "Fidelawit ፊደላዊት", 
 
     url: "https://www.youtube.com/watch?v=B4u4A7CF3N0" 
 
     }, 
 
     { 
 
     title: "Heran ሔራን", 
 
     url: "https://www.youtube.com/watch?v=_TlRGhOdLJ0" 
 
     }, 
 
     { 
 
     title: "Lela Mafia ሌላ ማፊያ", 
 
     url: "https://www.youtube.com/watch?v=_i8C9gO91ts" 
 
     } 
 
    ]; 
 
    });

<!DOCTYPE html> 
 
<html> 
 
<head> 
 
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.22/angular.min.js"></script> 
 
</head> 
 
<body ng-app='clientApp'> 
 

 
<table class="table table-striped" ng-controller="MoviesCtrl"> 
 
    <thead> 
 
    <th>Title</th> 
 
    <th>URL</th> 
 
    </thead> 
 
    <tbody> 
 
     <tr ng-repeat="movie in movies"> 
 
     <td>{{ movie.title }}</td> 
 
     <td>{{ movie.url }}</td> 
 
     </tr> 
 
    </tbody> 
 
</table> 
 

 
</body> 
 
</html>

来源

2016-08-17 15:30:41 ajaykumar

谢谢你们修好了 – Harun

ng-repeat无法正常工作

回答

相关问题