我的AngularJS代碼不起作用

我正在學習AngularJS，並以ToDoList基本應用程序的下列代碼結束。我在瀏覽器中看到它不工作。我是新來的角度，可能不會得到明顯的事情，所以我想，如果我的應用程序的名稱是我的AngularJS代碼不起作用

todoApp

然後，我應該把

$scope.todoApp

，而不是

$scope.todo

但事實證明，這不是一個問題。

<!DOCTYPE html> 
    <html ng-app="todoApp"> 
    <head> 
    <title>To DO List</title> 
    <link href="bootstrap.css" rel="stylesheet"> 
    <link href="bootstrap-theme.css" rel="stylesheet> 
    <script type="text/javascript" src="angular.min.js"></script> 
    <script type="text/javascript"> 
     var model = { 
      user: "Adam", 
      items: [{ action: "Buy flowers", done: false }, 
        { action: "Get Shoes", done: false }, 
        { action: "Collect Tickets", done: true }, 
        { action: "Call Joe", done: false }] 
      }; 
     var todoApp = angular.module("todoApp", []); 

     todoApp.controller("ToDoCtrl", function($scope) { 
      $scope.todo = model; 
      }); 
    </script> 
    </head> 
<body ng-controller="ToDoCtrl"> 
    <div class="page-header"> 
    <h1> 
     {{todo.user}}'s To Do List 
     <span class="label label-default">{{todo.items.length}}</span> 
    </h1> 
    </div> 
    <div class="panel"> 
    <div class="input-group"> 
     <input class="form-control" /> 
     <span class="input-group-btn"> 
      <button class="btn btn-default">Add</button> 
     </span> 
    </div> 
    <table class="table table-striped"> 
     <thead> 
      <tr> 
       <th>Description</th> 
       <th>Done</th> 
      </tr> 
     </thead> 
     <tbody> 
      <tr ng-repeat="item in todo.items"> 
       <td>{{item.action}}</td> 
       <td><input type="checkbox" ng-model="item.done" /></td> 
       <td>{{item.done}}</td> 
      </tr> 
      </tbody> 
     </table> 
    </div> 
    </body> 
</html>

這就是我在瀏覽器中得到..

而這正是我想我應該得到...

爲什麼它不工作？

來源

2015-09-25 Alexandra Prodan

在控制檯中的任何錯誤？您在樣式表中缺少''' – Manwal

SO嘗試改爲doApp – PeonProgrammer

您的HTML無效，因爲您在鏈接標記的rel屬性中缺少"。在這裏，你缺失：

<link href="bootstrap-theme.css" rel="stylesheet> 
               ^==> missing "

Working DEMO/* updated css */

有在DEMO看看無效的HTML。在這裏你可以看到link標籤後的HTML是綠色的。

來源

2015-09-25 16:08:49 Manwal

非常感謝！我應該可能已經嘗試驗證html至少...... –

是@AlexandraProdan。這也是一個重要的方面。 – Manwal

我的AngularJS代碼不起作用

回答

相關問題