AngularJS應用程序不加載

我試圖做一個簡單的AngularJS應用：AngularJS應用程序不加載

HTML：

<!DOCTYPE html> 
<html lang="en"> 

<head> 
    <link rel="stylesheet" type="text/css" href="style.css"/> 
</head> 

<body ng-app="myApp"> 
    <div ng-controller="mainController"> 
     Order by column: <select ng-model="columnName"> 
           <option value="+name">Name ASC</option> 
           <option value="age">Age ASC</option> 
           <option value="-salary">Salary DESC</option> 
          </select> 
     <br/> 
     <table> 
      <thead> 
       <tr> 
        <th>Name</th> 
        <th>Age</th> 
        <th>Salary</th> 
       </tr> 
      </thead> 
      <tbody> 
       <tr ng-repeat="employee in employees | orderBy:columnName"> 
        <td>{{ employee.name }}</td> 
        <td>{{ employee.age }}</td> 
        <td>{{ employee.salary }}</td> 
        **<td>{{ employee.salary }}</td>** 
       </tr> 
      </tbody> 
     </table> 
    </div> 
    <script src="angular.min.js"></script> 
    <script src="jquery-1.11.3.js"></script> 
    <script src="app.js"></script> 
</body> 

</html>

AngularJS：

var app = angular.module('myApp', []); 

app.controller('mainController', ['$scope',function($scope) { 
    var employees1 = [ 
     {name: 'Jim', age: 18, salary: 4500, DOB: new Date("November 18th, 2009")}, 
     {name: 'Joe', age: 18, salary: 4000, DOB: new Date("November 18th, 2012")}, 
     {name: 'Bob', age: 20, salary: 6000, DOB: new Date("November 18th, 2004")}, 
     {name: 'Rob', age: 45, salary: 1800, DOB: new Date("November 18th, 2001")} 
    ]; 

    $scope.employees = employees1; 
    $scope.columnName = '+name'; 
}]);

編輯：

我添加了Date對象在我的員工陣列中，當我嘗試在tr中的ng-repeat中將它們打印出來時，它一直讓我爲null日期欄：

來源

2016-01-11 LP496

看看你的控制檯是否有錯誤.. – Rayon

哦，我甚至不知道爲什麼我沒有想到...控制檯說：錯誤：[$ injector：unpr] http：//錯誤。 angularjs.org/1.5.0-rc.0/$injector/unpr?p0=orderbyFilterProvider%20%3C-"

但我做了一個雙向數據綁定的列名使用ng-model在選擇HTML元素 – LP496

@ KB3我已經更新了我的答案 –

啊，是的，你是對的！由於某種原因添加了冒號... – LP496

像以前的答案，改變「排序依據」 filterProvider錯字。

對於日期對象（空值），在你給數據的問題，

var employees1 = [ 
    {name: 'Jim', age: 18, salary: 4500, DOB: new Date("November 18th, 2009")}, 
    {name: 'Joe', age: 18, salary: 4000, DOB: new Date("November 18th, 2012")}, 
    {name: 'Bob', age: 20, salary: 6000, DOB: new Date("November 18th, 2004")}, 
    {name: 'Rob', age: 45, salary: 1800, DOB: new Date("November 18th, 2001")} 
];

新的日期（「2001年11月18日」）是錯誤的日期功能裏面你傳遞的字符串作爲錯誤（ 18日只需要給18）。正因爲如此，在轉換爲日期時，它給出了空值。

所以請在java腳本中參考日期函數和日期格式。 refer this link。轉換爲您想要顯示的任何格式。

來源

2016-01-11 05:51:28 Thangadurai

謝謝！這是問題... – LP496

AngularJS應用程序不加載

相關問題