我的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代码不起作用

回答

相关问题