Javascript ng.checked in angular.js不使用HTML追加_Javascript_Jquery_Html_Angularjs

Javascript ng.checked in angular.js不使用HTML追加

javascript jquery html angularjs

Javascript ng.checked in angular.js不使用HTML追加,javascript,jquery,html,angularjs,Javascript,Jquery,Html,Angularjs,这是一个待办事项应用程序。在输入中键入内容时，新代码将附加到div.container。然后带有ng checked=“checkAll”的“新生儿”复选框（应选中容器中的所有复选框）不响应带有ng model=“checkAll”的主复选框中的更改。在此期间，已存在的选中了ng的辅助复选框将响应主复选框。如何解决这个问题 <body ng-app="App" ng-controller="AppCtrl"> <h1 class="heading">TODODO!<

这是一个待办事项应用程序。在输入中键入内容时，新代码将附加到

div.container

。然后带有

ng checked=“checkAll”

的“新生儿”复选框（应选中容器中的所有复选框）不响应带有

ng model=“checkAll”

的主复选框中的更改。在此期间，已存在的选中了

ng

的辅助复选框将响应主复选框。如何解决这个问题

<body ng-app="App" ng-controller="AppCtrl">
<h1 class="heading">TODODO!</h1>

<div class="container">
    <form ng-submit="newTask()">
        <input type="checkbox" ng-model="checkAll">
        <input type="text" ng-model="text" name="text" placeholder="What tododo?">
    </form>
    <input type="checkbox" ng-checked="checkAll">
</div>
</body>


托多多！

脚本：

var App = angular.module("App", []);

App.controller('AppCtrl', function ($scope) {
    $scope.list = [];
    $scope.newTask = function () {
        if ($scope.text) {
            $('.container').append("<div class='task'><input type='checkbox' ng-checked='checkAll'/>" + this.text + "</div>");
            $scope.list.push(this.text);
            $scope.text = '';
        }
    };

});

var-App=angular.module（“App”，[]）；
App.controller（'AppCtrl'，函数（$scope）{
$scope.list=[]；
$scope.newTask=函数（）{
if（$scope.text）{
$（'.container'）.append（“+this.text+”）；
$scope.list.push（this.text）；
$scope.text=''；
}
};
});

问题在于两个复选框使用相同的型号。为每个模型创建不同的模型，并选中ng。如果您不想在选中某个复选框时影响任何其他复选框，则该复选框将显示她自己的属性名称。例如：

<body ng-app="App" ng-controller="AppCtrl">
<h1 class="heading">TODODO!</h1>

<div class="container">
    <form ng-submit="newTask()">
        <input type="checkbox" ng-model="doNotAffectSecond" ng-checked="doNotAffectSecond">
        <input type="text" ng-model="text" name="text" placeholder="What tododo?">
    </form>
    <input type="checkbox" ng-model="doNotAffectFirst" ng-checked="doNotAffectFirst">
</div>
</body>


托多多！

这是通用的，您可以自定义它。在您的情况下，如果选中第一个复选框，

checkAll

将为true，并且将自动选中第二个带有的复选框。

目标是强制主复选框影响所有辅助复选框。

在这段时间内，已存在的带有ng checked的辅助复选框将响应主复选框。如何修复？

很抱歉，但是你想修复什么？没关系，mb我不够清楚：）我的意思是

表单后面的输入响应主检查，而那些通过脚本（在div.task
标记中）创建的输入没有响应-这就是问题所在。Well没有响应，因为只有在提交表单时才显示该复选框，所以div任务
不知道上面的那些。