AngularJS中复选框(checkbox)的ng-model

ng-model 是 AngularJS 中的一个重要属性,表示数据的双向绑定。
但是当其作用在复选框中时,与其他可输入文本的表单又稍有区别。

复选框中的 ng-model ,其值只有 truefalse
不用想,就知道代表的是『是否选中』的意思。

比如,页面初始化时,我在controller中定义如下:

$scope.plan = {
    lastYear:false,
    custom:true
};

而页面方面:

<div class="col-md-12">
    <div class="form-inline">
        <input type="checkbox" id="lastYear" ng-model="plan.lastYear" ng-click="clickLastYear()">
        <label for="lastYear" ng-click="clickLastYear()">根据上一年xxx生成公区预算明细</label>
    </div>
    <div class="form-inline">
        <input type="checkbox" id="custom" ng-model="plan.custom" ng-click="clickContent()">
        <label for="custom" ng-click="clickContent()">自定义</label>
    </div>
</div>

那么其效果:

image_1bvme9gdvd3u31nm0i3c612uf9.png-6.3kB

更详细的资料:
AngularJs checkbox绑定
Angularjs checkbox的ng属性

posted on 2017-11-24 15:21  Yoooshiki  阅读(10128)  评论(0编辑  收藏  举报

导航