2014-07-11 90 views
0

我得到了一段代码角js的客户端数据绑定。我不熟悉角js。 所以这里是代码客户端数据绑定与角js

<html ng-app> 
<head> 
    <script src="scripts/angular.js"></script> 
    <script src="scripts/controller.js"></script> 
    <link href="Content/bootstrap.css" rel="stylesheet" /> 
    <title></title> 
</head> 
<body> 
    <div ng-controller="MainController"> 
     <div> 
      <h1>{{readingList.Name}}'s Reading List</h1> 
     </div> 
     <br /> 
     <div> 
      <table class="table table-bordered table-condensed" > 
       <thead> 
        <tr> 
         <th>Title</th> 
         <th>IsComplete</th> 
         <th></th> 
        </tr> 
       </thead> 
       <tbody> 
        <tr ng-repeat="book in readingList.Books"> 
         <td>{{book.Title}}</td> 
         <td>{{book.isComplete}}</td> 
         <td><input type="checkbox" ng-model="book.isComplete" /></td> 
        </tr> 
       </tbody> 
      </table> 
     </div> 
    </div> 
</body> 
</html> 

var MainController = function ($scope) { 

    var model = { 
     Name: "Madhur Kapoor", 
     Books: [{ Title: "The Hunger Games", isComplete: false }, 
       { Title: "The Alchemist", isComplete: true }, 
       { Title: "Angel & Demons", isComplete: false }, 
       { Title: "Da Vinci Code", isComplete: true }, 
       { Title: "The Godfather", isComplete: false } 
     ] 
    }; 

    $scope.readingList = model; 

}; 

现在我的问题是,如何检查,因为检查属性用于检查未选中的复选框复选框将被选中或取消选中,但如果你看到它的代码看起来像<input type="checkbox" ng-model="book.isComplete" />

如果angular在运行时将check属性添加到复选框,那么angular js如何检测控件是复选框而不是单选按钮?请帮助我了解如何将检查属性添加到复选框。很混乱。谢谢

+0

'checkbox'结合到与它(TRUE;或'FALSE')相关联的'NG-model' - 'radio'结合到无线电的值按钮。 – tymeJV

回答

0

当您将ng-model分配给输入时,角度会检查该输入的类型并将其绑定到正确的属性。

对于复选框,它将绑定到'checked'属性。对于文本,它将绑定到基础值。

更多关于NG-模型API:https://docs.angularjs.org/api/ng/directive/ngModel