AngularJS实现表单的全选与反选(小案例)

发布时间:2016-12-28 编辑:小张个人博客 查看次数:5011

AngularJS实现表单的全选与反选(小案例)

    <div ng-app="hd" ng-controller="_an" ng-cloak class="ng-cloak">

    <table border="1px" width="550px" >
        <tr>
            <td>
                <input type="checkbox" ng-model="all"/> 
                <span ng-bind="all?'取消' : '全选'">全选</span>
            </td>
            <td>名称</td>
            <td>url</td>
        </tr>
        <tr ng-repeat="v in goods">
            <td><input type="checkbox" ng-model="all"/> </td>
            <td>{{v.name}}</td>
            <td>{{v.url}}</td>
        </tr>
    </table>

    </div>
    <script src="./AngularJS.js"></script>
    <script>
        var m = angular.module('hd',[]);
        m.controller('_an',['$scope',function($scope){
               $scope.goods =[
                   {'name':'小张个人博客1','url': '023xs.cn'},
                   {'name':'小张个人博客2','url': '023xs.cn'},
                   {'name':'小张个人博客3','url': '023xs.cn'}
               ];
        }]);

    </script>


出处:小张个人博客

网址:http://blog.023xs.cn/

您的支持是对博主最大的鼓励,感谢您的认真阅读。欢迎转载,但请保留该声明。

顶部

Copyright © 小张个人博客 All Rights Reserved 渝ICP备15006773号-1

联系方式:[email protected] | 本站文章仅供学习和参考

渝公网安备 50024102500267号