Question

当我检查主复选框时，应检查所有子复选框，并且在选中复选框时也应显示其内容，否则不应显示其内容但问题是检查子复选框但如果我手动检查子复选框，则会在检查主复选框时显示其内容。

<!DOCTYPE html>
        <html>
            <head>
                <title>Angular Demo</title>
                <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular.min.js"></script>
            </head>
            <body data-ng-app="">
                <table>
                    <tr>
                        <td>
                            <input type="checkbox" data-ng-model="parent"/>
                        </td>
                        <td data-ng-show="parent" class="left">
                            It's master
                        </td>
                    </tr>
                    <tr>
                        <td>
                            <input type="checkbox" data-ng-model="child_1" data-ng-checked="parent"/>
                        </td>
                        <td data-ng-show="child_1">
                            It's child 1
                        </td>
                    </tr>
                    <tr>
                        <td>
                            <input type="checkbox" data-ng-model="child_2" data-ng-checked="parent"/>
                        </td>
                        <td data-ng-show="child_2">
                            It's child 2
                        </td>
                    </tr>
                </table>
            </body>
        </html>

Answer 1

我已经解决了这个问题。

<input type="checkbox" data-ng-model="parent" data-ng-change="child_1= parent;
                            child_2=parent;" />

请click在此处查看代码。

Answer 2

您没有与子模型交互 - 您直接从父级设置checked属性。

相反，为您的父母处理ng-checked：

<input type="checkbox" data-ng-model="parent" ng-checked="parentChanged()"/>

在你的控制器中，将每个孩子的模型设置为父值：

$scope.parentChanged = function(){
child_1 = parent;
child_2 = parent;
}

同时从您的视图的子节点中删除data-ng-checked =“parent”。

<input type="checkbox" data-ng-model="child_1">
...
<input type="checkbox" data-ng-model="child_2">

Answer 3

您必须设置属性＆＃34; child_1＆＃34;像这样：

<input type="checkbox" data-ng-model="child_1" data-ng-checked="child_1 = parent"/>

您可以看到如何操作：Here

以编程方式更改ngmodel时，未获取ng-model的更新值

3 个答案: