zoukankan      html  css  js  c++  java
  • Angularjs checkbox的ng属性

    angularjs 默认给 input[checkbox] 元素定制了一些属性,如:

    <input type="checkbox" ng-mudel="name" ng-true-value="yes" ng-false-value="no" ng-change="fn()">

    ng-mudel 属性是Angularjs里面最常见的属性了,是用来数据双向绑定的属性。

    ng-true-value 属性设置当 checkbox 选择状态返回的值。

    ng-false-value 属性设置当 checkbox 非选择状态返回的值。

    ng-change 属性设置当 checkbox 选择状态改变的时候调用的函数。

    默认checkbox:

    复制代码
    <div ng-controller="checkout">
        <input type="checkbox" ng-model="defaut_choose">
        <p>{{defaut_choose}}</p>
    </div>
    <script>
    function checkout($scope){
      //
    }
    </script>
    复制代码

     

    添加其他属性的 checkbox:

    复制代码
    <div ng-controller="checkout">
     <input type="checkbox" ng-model="choose" ng-true-value="choosed" ng-false-value="unchoosed" ng-change="backfn();">
     <p>{{choose}}</p>
    </div>
    <script>
    function checkout($scope){
      $scope.choose = "choosed";
      $scope.backfn=function(){
        alert("checkbox值改变");
      }
    }
    </script>
    复制代码

    如果想 ng-change 触发的函数里获取到该触发该函数的元素不能直接传入 this ,而需要传入 $event 。因为在 Angularjs 里面,这个地方的 this 是 $scope 。我们可以传入 $event ,然后在 函数里面通过 $event.target 来获取到该元素。

  • 相关阅读:
    查看jvm的cg情况
    什么是json
    httpclient工具类
    mysql 优化思路(1)
    mysql存取日期出问题
    springboot和tomcat jar包冲突
    递归
    如何去理解return?
    js BOM判断当前窗口是否最顶层。
    个人笔记,关于ajax 如果没有请求成功不允许再次请求的方法。
  • 原文地址:https://www.cnblogs.com/heidsoft/p/3977252.html
Copyright © 2011-2022 走看看