博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
AngularJS checkbox/复选框 根据缓存数据实时显示
阅读量:5335 次
发布时间:2019-06-15

本文共 2719 字,大约阅读时间需要 9 分钟。

想缓存选择按钮时,可以使用这样的方法。

index.html

1  2  3  4      5      6  7  8  9     
Choose Tags
10
11
You have choosen:
12

13
16

17
18
{
{ category.name }}
19
20
21
22 {
{ tag.name }}23
24
25

26
27
28 29
{
{selected|json}}
30
{
{selectedTags|json}}
31 32 33

ng-checked:是angular封装用来控制该checkbox是否选中使用的,return true是选中,反则不选中;

ng-click:这个是angular封装的的onclick方法,可以传入$event;

script.js

1  2  3   4  5  6 var iApp = angular.module("App", []); 7  8  9 10 iApp.controller('AddStyleCtrl', function($scope)11 {12     $scope.tagcategories = [13         { 14             name: 'Color',15             tags: [16                 {17                     id:1,18                     name:'color1'19                 },20                 {21                     id:2,22                     name:'color2'23                 },24                 {25                     id:3,26                     name:'color3'27                 },28                 {29                     id:4,30                     name:'color4'31                 },32             ]33         },34         { 35             name:'Cat',36             tags:[37                 {38                     id:5,39                     name:'cat1'40                 },41                 {42                     id:6,43                     name:'cat2'44                 },45             ]46         },47         { 48             name:'Scenario',49             tags:[50                 {51                     id:7,52                     name:'Home'53                 },54                 {55                     id:8,56                     name:'Work'57                 },58             ]59         }60     ];61 62     $scope.selected = []; 63 64   65 66     $scope.updateSelection = function($event, id){67         var checkbox = $event.target;68         var action = (checkbox.checked?'add':'remove');//这里有点奇怪 相反了  69         if(action == 'add' && $scope.selected.indexOf(id) == -1){70             $scope.selected.push(id); 71         }72         if(action == 'remove' && $scope.selected.indexOf(id)!=-1){73             var idx = $scope.selected.indexOf(id);74             $scope.selected.splice(idx,1); 75         }76     }77 78     $scope.isSelected = function(id){79         return $scope.selected.indexOf(id)>=0;80     }81 });

 

转载于:https://www.cnblogs.com/dannyxie/p/6519958.html

你可能感兴趣的文章
Zookeeper概述
查看>>
Zookeeper一致性级别
查看>>
单例模式的几种实现方式及对比
查看>>
邓白氏编码 申请
查看>>
Linux远程登录
查看>>
Linux自己安装redis扩展
查看>>
HDU 1016 Prime Ring Problem(dfs)
查看>>
苹果官方例子
查看>>
C#中结构体与字节流互相转换
查看>>
WIN10配置MongoDB
查看>>
iOS resign code with App Store profile and post to AppStore
查看>>
python 表格操作
查看>>
LeetCode 84. Largest Rectangle in Histogram
查看>>
LeetCode Two Sum III - Data structure design
查看>>
session和xsrf
查看>>
Cookie与Session
查看>>
配置redis外网可访问
查看>>
跟随大神实现简单的Vue框架
查看>>
Linux目录结构
查看>>
learning awk
查看>>