AngularJS自動無效

Question

我正在使用AngularJS編寫客戶端應用程序以獲得樂趣。 在應用程序的一部分中，它應該在表中顯示所有申請者，從我的JSON數組中自動獲取。 但它沒有用。

這是我的代碼：

 //engine.js (function(){ angular .module("resumeBase", []); })(); //controllers.js (function(){ angular .module("resumeBase") .controller("tabularList", listController); function listController() { var vm = this; vm.data = applicants; } var applicants = [ { firstname: "Nima", lastname: "Bavari", evaluation: 5, category: "IT & Computers", fileLocation: "", empConfirmed: "found", confirmTime: "01-01-2017", employer: "EnDATA", payConfirmed: "yes" } ] })();

 <!DOCTYPE html> <html ng-app="resumeBase"> <head> <title>::Search Entries::</title> <link rel="stylesheet" type="text/css" href="style/main.css" /> </head><body> <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.4/angular.js"></script> <script type="text/javascript" src="scripts/engine.js"></script> <script type="text/javascript" src="scripts/controllers.js"></script> <div id="container" ng-controller="tabularList"> <hr /> <table> <tr> <th>Firstname</th> <th>Lastname</th> <th>Evaluation</th> <th>Category</th> <th>Resume</th> <th>Found Job?</th> <th>Date and Time</th> <th>Employer</th> <th>Paid Us?</th> </tr> <tr ng-repeat="item in tabularList.data"> <td>{{item.firstname}}</td> <td>{{item.lastname}}</td> <td>{{item.evaluation}}</td> <td>{{item.category}}</td> <td><a ng-href="{{item.fileLocation}}" target="blank">{{item.fileLocation}}</a></td> <td>{{item.empConfirmed}}</td> <td>{{item.confirmTime}}</td> <td>{{item.employer}}</td> <td>{{item.payConfirmed}}</td> </tr> </table> [<a href="index.php">Add New Entry</a>] </div> </body> </html>

您有什么推薦的嗎？ 我的錯誤在哪里？

Answer 1

您缺少controller as syntax ，只需將您的HTML更改為，

  <div id="container" ng-controller="tabularList as vm">

也，

 <tr ng-repeat="item in vm.data">

DEMO

 //engine.js (function(){ angular .module("resumeBase", []); })(); //controllers.js (function(){ angular .module("resumeBase") .controller("tabularList", listController); function listController() { var vm = this; vm.data = applicants; } var applicants = [ { firstname: "Nima", lastname: "Bavari", evaluation: 5, category: "IT & Computers", fileLocation: "", empConfirmed: "found", confirmTime: "01-01-2017", employer: "EnDATA", payConfirmed: "yes" } ] })();

 <!DOCTYPE html> <html ng-app="resumeBase"> <head> <title>::Search Entries::</title> <link rel="stylesheet" type="text/css" href="style/main.css" /> </head><body> <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.4/angular.js"></script> <div id="container" ng-controller="tabularList as vm"> <hr /> <table> <tr> <th>Firstname</th> <th>Lastname</th> <th>Evaluation</th> <th>Category</th> <th>Resume</th> <th>Found Job?</th> <th>Date and Time</th> <th>Employer</th> <th>Paid Us?</th> </tr> <tr ng-repeat="item in vm.data"> <td>{{item.firstname}}</td> <td>{{item.lastname}}</td> <td>{{item.evaluation}}</td> <td>{{item.category}}</td> <td><a ng-href="{{item.fileLocation}}" target="blank">{{item.fileLocation}}</a></td> <td>{{item.empConfirmed}}</td> <td>{{item.confirmTime}}</td> <td>{{item.employer}}</td> <td>{{item.payConfirmed}}</td> </tr> </table> [<a href="index.php">Add New Entry</a>] </div> </body> </html>

AngularJS自動無效

問題描述

1 個解決方案

解決方案1
0 已采納 2017-06-14 02:17:27

AngularJS自動無效

問題描述

1 個解決方案

解決方案1 0 已采納 2017-06-14 02:17:27

解決方案1
0 已采納 2017-06-14 02:17:27