① angularjs如何删除一个元素内的对象从 ng-repeat 吗
解决方法 1:
使用 for ... in 循环遍历一个数组并不是正确的它不只考虑一个数组的元素。既不删去与数组的一个元素 delete 。这并不改变数组的大小。
一个相当简单的解决方案是筛选数组 ∶
vm.deleteElements = function(){
vm.classification.forEach(function (classification) {
classification.beneficiaries = classification.beneficiaries.filter(function(beneficiary) {
return !beneficiary.selected;
});
});
}
或如果浏览器支持 ES6:
vm.deleteElements = function(){
vm.classification.forEach( classification =>
classification.beneficiaries = classification.beneficiaries.filter(beneficiary => !beneficiary.selected)
);
}
② angularjs 怎么用多个多选框来控制ngrepeat的一个筛选
<!doctypehtml>
<html>
<head>
<metacharset="utf-8">
<title>test</title>
<scriptsrc="angular.js"></script>
<script>
varmyApp=angular.mole("myApp",[]);
myApp.filter('myfilter',function(){
returnfunction(input,toggle){
vartmp=[];
angular.forEach(input,function(value,key){
switch(toggle){
case'a':
if(value>0)
tmp.push(value);
break;
case'b':
if(value>2)
tmp.push(value);
break;
case'c':
if(value<4)
tmp.push(value);
break;
default:
tmp=input;
}
});
returntmp;
};
});
myApp.controller("testCtrl",function($scope){
$scope.items=[0,1,2,3,4];
$scope.toggle='';
});
</script>
</head>
<body>
<divng-app="myApp">
<divng-controller="testCtrl">
<ul>
<ling-repeat="iteminitems|myfilter:toggle">{{item}}</li>
</ul>
<inputtype="checkbox"ng-model="toggle"ng-true-value="'a'"/>a
<inputtype="checkbox"ng-model="toggle"ng-true-value="'b'"/>b
<inputtype="checkbox"ng-model="toggle"ng-true-value="'c'"/>c
</div>
</div>
</body>
</html>
③ AngularJS在ng-repeat内使用ng-model出现哪些问题
有一些问题:
1.ng-model="obj.qqs[$index]"应该是ng-model="qq"这个就可以解决focus消失的问题。
2.一般不把primitivetype的变量作为ng-model,这里可以用literalobject。
3.如何通过按钮保存,用ng-click即可。
4.Style的问题。用'controllerasctrl'的语法,避免在controller里面使用$scope。
④ 有关angularjs中ng-repeat循环中ng-model的问题,是怎么解决的
Texeure是在全局scope下面的,而repeat里面有自己的scope,这个scope“继承”全局的scope。
input的model应该使用repeat里的scope有效的变量。
⑤ angular filter 对数组过滤时,排除arr怎么做
js:
$scope.arr = [
["212","上","下","左","右"],
["12","1","2","3","4"],
]
html:
<input type="text" ng-model="text">
<tr ng-repeat="dataTr in arr | filter:text">
<td ng-repeat="dataTd in dataTr">
<ng-switch on="$first">
<span ng-switch-when="true">{{index+1}}</span>
<span ng-switch-default>{{dataTd}}</span>
</ng-switch>
</td>
</tr>
⑥ ng-repeat 怎么实现一次性数据绑定
定义了一个ng-repeat的ng-model双向绑定输入框
<ul>
<li ng-repeat="listVed in listVeds">
<div class="row">
<div class="col-xs-3"><input type="text" class="form-control" ng-model="listVed.lastName" placeholder="Employee No"></div>
</div>
</li>
</ul>
⑦ angularjs 可以从ng-repeat中循环出五条数据吗
循环输出列表很多项目在web服务端做,前端做好模版后后端写jsp代码,双方需要紧密合作,分清责任。有些项目由后端提供restful方法,前端用ajax调用自己循环,这种一般是大把的jquery拼字符串,太不直观,有人搞出了js模板,也没好到哪里去。
用AngularJS就爽多了,语法和JSP类似:
?
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
<!doctype html>
<html ng-app>
<head>
<meta charset="utf-8">
<title>ng-repeat directive</title>
</head>
<body>
<table ng-controller="CartController">
<caption>我的购物车</caption>
<tr>
<th>序号</th>
<th>商品</th>
<th>单价</th>
<th>数量</th>
<th>金额</th>
<th>操作</th>
</tr>
<tr ng-repeat="item in items">
<td>{{$index + 1}}</td>
<td>{{item.name}}</td>
<td>{{item.price | currency}}</td>
<td><input ng-model="item.quantity"></td>
<td>{{item.quantity * item.price | currency}}</td>
<td>
<button ng-click="remove($index)">Remove</button>
</td>
</tr>
</table>
<script src="../lib/angularjs/1.2.26/angular.min.js"></script>
<script>
function CartController($scope) {
$scope.items = [
{name: "雷柏(Rapoo) V500 机械游戏键盘 机械黄轴", quantity: 1, price: 199.00},
{name: "雷柏(Rapoo) V20 光学游戏鼠标 黑色烈焰版", quantity: 1, price: 139.00},
{name: "AngularJS权威教程", quantity: 2, price: 84.20}
];
$scope.remove = function (index) {
$scope.items.splice(index, 1);
}
}
</script>
</body>
</html>
ng-repeat指令生命在需要循环内容的元素上,items和控制器上的变量名对应,item是为数组中单个对象起的别名。$index可以返回当前引用对象的序号,从0开始,另外还有$first、$middle、$last可以返回布尔值,用于告诉你当前元素是否是集合中的第一个中间的最后一个元素。
⑧ 如何在ng-repeat遍历的元素中动态设置样式
<html ng-app="myApp">
<head lang="en">
<meta charset="UTF-8">
<title></title>
<script src="js/angular.js"></script>
</head>
<body ng-controller="myCtrl">
<input type="checkbox" ng-model="isAgreen"/>同意?
<script>
var app=angular.mole('myApp',['ng']);
app.controller("myCtrl",function($scope){
$scope.$watch("isAgreen",function(){
console.log($scope.isAgreen);
});
});
</script>
</body>
</html>
<img src="http://img.blog.csdn.net/20161103195723492?watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQv/font/5a6L5L2T/fontsize/400/fill/I0JBQkFCMA==/dissolve/70/gravity/Center" alt="" />
</span>
这段代码是在没数据的时候可以直接在控制台打印出true或false。
[html] view plain
<span style="color:#006600;"><!DOCTYPE html>
<html ng-app="myApp">
<head lang="en">
<meta charset="UTF-8">
<title></title>
<script src="js/angular.js"></script>
</head>
<body ng-controller="myCtrl">
<table>
<thead>
<tr>
<th>请选择</th>
<th>姓名</th>
<th>生日</th>
</tr>
</thead>
<tbody>
<span style="color:#FF0000;"><tr ng-repeat="obj in data">
<td><input type="checkbox" ng-model="isAgreen" />同意?</td></span>
<td>{{obj.name}}</td>
<td>{{obj.age}}</td>
<td>{{$index}}</td>
</tr>
</tbody>
</table>
⑨ angular 中ng-repeat能不能遍历指定顺序
能呀,后面加个Order by 就好了
⑩ angular中用ng-repeat创建的元素怎么获取其中某几个
通过写过滤器来获取其中某几个。
比如
<!DOCTYPEhtml><html><head><metacharset="utf-8"><scriptsrc="http://apps.bdimg.com/libs/angular.js/1.4.6/angular.min.js"></script></head><body><divng-app="myApp"ng-controller="namesCtrl"><p>输入过滤:</p><p><inputtype="text"ng-model="test"></p><ul><ling-repeat="xinnames|filter:test|orderBy:'country'">{{(x.name|uppercase)+','+x.country}}</li></ul></div><scriptsrc="namesController.js"></script></body></html>