2016-07-09 20 views
1

我是angularjs的新手,嘗試使用ng-repeat指令示例將數據綁定到HTML表格元素。 我的js文件位於腳本位置,它具有一個模塊和控制器,其中的某些數據附加到該控制器中的作用域對象。ng-repeat不綁定數據

現在我想要的只是將該數據綁定到我的HTML表格元素並使用ng-repeat顯示數據。我正在使用ng-repeat,因爲我有多行要顯示在表中。

這裏是我的角度代碼:

`

/// <reference path="angular.min.js" /> 
/// <reference path="angular.js" /> 



var angularModule = angular.module("TestMyModule", []); 
    angularModule.controller("MyController", function ($scope) { 
    var employee = [ 
        {FirstName: "GGG",LastName: "SSS",MiddleName:"G"}, 
        {FirstName: "G",LastName: "S",MiddleName: "GG"}, 
        {FirstName: "GGS",LastName: "GSS",MiddleName: "GS"}, 
        {FirstName: "Go",LastName: "Sa",MiddleName: "Gu"}, 
        {FirstName: "Goo",LastName: "SAA",MiddleName: "Gu"} 
    ]; 
    debugger; 
    $scope.employee = employee; 

}); 

`

以下是我的HTML代碼

<!DOCTYPE html> 
<html ng-app="angularModule"> 
<head> 
    <title>AngularJS Example</title> 
    <script src="Scripts/AngularExample.js"></script> 
    <script src="Scripts/angular.min.js"></script> 

</head> 
<body > 
     <table ng-controller="MyController"> 
      <thead> 
       <tr> 
        <th>First Name</th> 
        <th>Last Name</th> 
        <th>Middle Name</th> 
       </tr> 
      </thead> 
      <tbody> 
       <tr ng-repeat="employees in employee"> 
        <td>{{employees.FirstName}}</td> 
        <td>{{employees.LastName}}</td> 
        <td>{{employees.MiddleName}}</td> 
       </tr> 
      </tbody> 
     </table> 
</body> 
</html> 

以下爲輸出THA T I得到:

First Name     Last Name   Middle Name 

{{employees.FirstName}} {{employees.LastName}} {{employees.MiddleName}}

使用瀏覽器調試工具,我發現下面的錯誤,但不知道如何解決:

AngularExample.js:6 Uncaught ReferenceError: angular is not defined 
angular.js:4631 Uncaught Error: [$injector:modulerr] http://errors.angularjs.org/1.5.7/$injector/modulerr?p0=angularModule&p1=Er…20c%20(http%3A%2F%2Flocalhost%3A2785%2FScripts%2Fangular.min.js%3A20%3A359) 
firebug-lite.js:11883 Synchronous XMLHttpRequest on the main thread is deprecated because of its detrimental effects to the end user's experience. For more help, check https://xhr.spec.whatwg.org/. 
firebug-lite.js:30905 Uncaught TypeError: Cannot read property 'push' of undefined 

有人可以幫我嗎?

+1

'ng-app'應該是'TestMyModule' –

回答

0

更改文件序列的加載方式,angular應在AngularExample.js之前加載,以便首先加載可用的API API。

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

而ng-app應該是ng-app="TestMyModule"這是角度模塊名稱。

+0

謝謝。這工作:-) – user6569407

+0

@ user6569407做接受答案,謝謝:) –

+0

@ user6569407看看這個答案知道[如何接受答案?](http://meta.stackexchange.com/questions/5234/how-does -accepting-的回答工作) –