绑定在Angularjs复选框在指令

Question

我在http://plnkr.co/PF7cRQE4n5lYube8oa3t

的templateUrl点普拉克用下面的代码来control.html。

hello from Directive 
<br />{{message}} 
<br /> 
<input type="checkbox" {{checkedstatus}} /> 
<br />Value of Checked Status = {{checkedstatus}} 

我的控制器和指令如下...

var app = angular.module('plunker', []); 

app.controller('MainCtrl', function($scope) { 
    $scope.name = 'World'; 
}) 
    .directive('myDir', function() { 
    var linkFunction = function(scope, element, attributes){ 
     scope.message = "The check box should be checked... no?"; 
     scope.checkedstatus = "checked"; 
    } 

    return { 
     restrict: 'E', 
     templateUrl: "control.html", 
     link: linkFunction, 
     scope: {} 
    }; 
    }) 

我的index.html文件是直线前进，并使用该指令......

<my-dir></my-dir> 

我是假设如果checkedstatus设置为“checked”，我会看到在UI中选中的复选框。但它不会以这种方式发生，并且仍然没有被检查。我的目标是将此复选框用作切换按钮来查看或隐藏我的视图的某些元素。

Answer 1

可以使用ng-checked

scope.checkbox={ 
    checkedstatus:true 
}; 

<input type="checkbox" ng-checked="checkbox.checkedstatus" /> 

或者您也可以plunkr

http://plnkr.co/edit/qkWyqrLBwYKv1ECZ0WHE?p=preview

0绑定模型

这样

<input type="checkbox" ng-model="checkbox.checkedstatus" /> 

检查