Javascript 如何使用angualrjs根据条件选择复选框？_Javascript_Html_Angularjs_Checkbox_Angularjs Directive

Javascript 如何使用angualrjs根据条件选择复选框？

javascript html angularjs checkbox

Javascript 如何使用angualrjs根据条件选择复选框？,javascript,html,angularjs,checkbox,angularjs-directive,Javascript,Html,Angularjs,Checkbox,Angularjs Directive,我有以下代码 html: <body ng-controller="MainCtrl"> <div ng-if="isOwner"> <input type="checkbox" ng-model="checkboxClicked" /> </div> <span ng-show="checkboxClicked">Non Editable</span>

我有以下代码

html:

<body ng-controller="MainCtrl">
   <div ng-if="isOwner">
      <input type="checkbox" ng-model="checkboxClicked"  
         />
   </div>
        <span ng-show="checkboxClicked">Non Editable</span> 
        <span ng-hide="checkboxClicked">Editable</span>  
  </body>

app.controller('MainCtrl', function($scope) {
  $scope.isOwner="true";
  $scope.checkboxClicked="true";
});

如果

Owner

和

checkboxClicked

值为

true

，则默认情况下执行时应始终选中

复选框

，即不可编辑。比如：

默认情况下，即使我们也刷新浏览器，它也应该执行相同的上述输出（这里也是在

Owner

和

checkboxClicked

值为

true

的情况下）

作为所有者，我们也可以

取消选中此复选框
，因此输出应带有可编辑复选框
，例如：可编辑



请在此上下文中帮助我根据上述屏幕截图和条件获得所需的输出，我已尝试使用该代码，但它给出了带有不可编辑文本的空复选框，因为我认为我无法编写条件
已创建。将变量直接绑定到$scope时，AngularJS存在一些问题：

要解决此问题，您必须创建一个附加对象，该对象将数据包装在模板中可用的$scope中：
app.controller('MainCtrl', function($scope) {
  $scope.data = {
    isOwner: false,
    checkboxClicked: false
  };
});

并相应地更改模板：
<div ng-if="data.isOwner">
  <input 
    type="checkbox"
    ng-model="data.checkboxClicked"/>
</div>
...


...
@mark，谢谢你的回复，但如果我确实喜欢上面的代码，我总是只获取可编辑文本，而不是按照我想要的输出获取。你能告诉我一次吗。@马克，我已经编辑了你的文章，在js中用true而不是false编辑，然后它按照我的预期工作良好，并且你的解释是angualrjs中的$scope问题。非常感谢您的帮助：-）