如果没有按预期做出响应
我有li元素有一个ng-if语句绑定到一个复选框。 如果我实际检查复选框，则ng-if按照预期进行响应。 但是，如果我通过JavaScript选中或取消选中复选框，则复选框将按预期方式进行选中或取消选中，但ng-if不响应。 这是否正常工作？ 有一个更好的方法吗？
这里是我的代码示例：“[]”=“<>”
HTML - 第1部分
[li id =“homebutton”ng-if =“homechecked！= true”onclick =“homeclicked（）”] [a ng-href =“/”] [img src =“images Neck01Home.png”alt =“首页“ /][/一个]
[li id =“thebandbutton”ng-if =“homechecked === true”onclick =“thebandclicked（）”] [a ng-href =“/ theband /”] [img src =“images Neck01TheBand.png”alt =“乐队”/] [/ a]
HTML - 第2部分
[label class =“menucontroller”] Home2：[input class =“menucontroller”id =“homecb”type =“checkbox”ng-model =“homechecked”ng-init =“homechecked = true”/] [/ label] [ br /]
[label class =“menucontroller”] TheBand2：[input class =“menucontroller”id =“bandcb”type =“checkbox”ng-model =“thebandchecked”/] [/ labe] [
[label class =“menucontroller”] Gallery2：[input class =“menucontroller”id =“gallerycb”type =“checkbox”ng-model =“gallerychecked”/] [/ label] [br /]
JavaScript ：
window.onload = function () {
}
function homeclicked() {
document.getElementById('homecb').checked = true;
document.getElementById('bandcb').checked = false;
document.getElementById('gallerycb').checked = false;
}
function thebandclicked() {
document.getElementById('homecb').checked = false;
document.getElementById('bandcb').checked = true;
document.getElementById('gallerycb').checked = false;
}
function galleryclicked() {
document.getElementById('homecb').checked = false;
document.getElementById('bandcb').checked = false;
document.getElementById('gallerycb').checked = true
}
你做错了， ng-if不会触发，因为你只操纵复选框的选中和未选中（使用javascript）而不是ng模型，不要尝试使用javascript来做到这一点，而是在你的角度控制器。
控制器：
$scope.homeclicked = function() {
$scope.homechecked = true;
$scope.thebandchecked = false;
$scope.gallerychecked = false;
};
复选框上的ng-model输入句柄被选中或取消选中，还有一个原生指令https://docs.angularjs.org/api/ng/directive/ngChecked用于处理选中和取消选中。
以适当的角度来做。
移动控制器内的功能。 通过ng-click打电话给他们。 让函数更改绑定到复选框的范围变量。
<li id="homebutton" ng-if="homechecked != true" ng-click="homeclicked()">
在你范围内的同时......
$scope.homeclicked = function {
$scope.homechecked = true;
$scope.thebandchecked = false;
$scope.gallerychecked = false;
}
如果你真的很想忽视我的建议并继续处理你的问题，那么你可以在你的函数中加入这一行：angular.element（document.getElementById（'homecb'））。$ scope （）$适用（）; 这又非常糟糕，完全应该避免。
使用
$scope.$apply();
它将运行摘要循环，并且您的ng-if将按照您的预期工作。
链接地址: http://www.djcxy.com/p/46049.html