2014-07-11 124 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