Angular 1:根据输入复选框更改md-checkbox

时间:2016-03-31 09:38:06

标签: angularjs

如何根据实际的复选框检查状态更改Angular素材中md-checkbox的检查状态?

这是我的复选框。他们在ng-repeat内。

    <input type="checkbox" ng-checked="item.completed" ng-model="toDoItemCheckbox">
    <md-checkbox
      ng-change="toggleToDoItem({{item.createdAt}})" ng-model="toDoItemCheckbox" aria-label="todo-checkbox">
    </md-checkbox>

2 个答案:

答案 0 :(得分:1)

为什么在已有md-checkbox时需要输入类型复选框。 md-checkbox的检查状态可以根据型号进行更改。

<section class="white-frame-z1" ng-repeat="todo in todos">
    <md-toolbar>
      <div class="md-toolbar-tools">
        <input type="checkbox" ng-model="todo.status" ng-click="toggleTodo(todo)" />Regular Checkbox
        <md-checkbox ng-model="todo.status">
          {{todo.name}}
        </md-checkbox>
      </div>
    </md-toolbar>
  </section>

查看此Codepen 以获取更多详细信息。

答案 1 :(得分:0)

您只需使用ng-model进行双向数据绑定即可:

<div ng-repeat="item in toDoItems">
    <input type="checkbox" ng-model="item.complete">
    <md-checkbox
      ng-change="toggleToDoItem({{item.createdAt}})" ng-model="item.complete" aria-label="todo-checkbox">
    </md-checkbox>
</div>

请参阅此Code Pen.