- 首页
- 其他开发
- 如何在 ng-repeat 中跳过 $index
如何在 ng-repeat 中跳过 $index
[英] How to skip $index in ng-repeat
本文介绍了如何在 ng-repeat 中跳过 $index的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！
问题描述
考虑以下事项:
<div ng-switch on="quest.ui.type"><div ng-switch-when="ms-select-single" ><div ms-select-single quest='quest'quest-num='{{(true)?numInc():return}}'></div>
<div ng-switch-when="ms-select-multy"><div ms-select-multy quest='quest'quest-num='{{(true)?numInc():return}}'></div>
<div ng-switch-when="ms-date"><div ms-date quest='quest'quest-num='{{(true)?numInc():return}}'>{{questNo}}</div>
<div ng-switch-when="ms-text"><div ms-text quest='quest'quest-num='{{(true)?numInc():return}}'>{{questNo}}</div>
<div ng-switch-when="ms-textarea"><div ms-textarea quest='quest'quest-num='{{(true)?numInc():return}}'>{{questNo}}</div>
<div ng-switch-when="ms-number"><div ms-number quest='quest'quest-num='{{(true)?numInc():return}}'>{{questNo}}</div>
<div ng-switch-when="ms-html"><div ms-html quest='quest'></div>
我在 quest-num='{{(true)?numInc():return}}'> 中的真实陈述应该是什么?
我想要实现的是当语句为真时有条件地增加模型值，如果程序中断时始终为真，那么我在这里的真实语句应该是什么?
numInc 返回模型中 num 值的 ++，首先在 0 处初始化，当它遇到函数时它会递增，但是因为我有 ng-switch，它会递增太多次，这就是为什么我需要 true/虚假陈述，我认为...
解决方案
我不确定我是否理解你的问题，但如果你想要这样的东西
标签实际 $index 值问题 1 01问题 2 2问题 3 3等等...
然后我们可以使用指令.这是一个快速草图
var app = angular.module('app', []);app.controller('MainController', function($scope){$scope.arr = [{name:'John', phone:'555-1276'},{姓名:'玛丽'，电话:'800-BIG-MARY'}，{name:'Mike', 电话:'555-4321', countMe:false},{姓名:'亚当'，电话:'555-5678'}，{姓名:'朱莉'，电话:'555-8765'}，{姓名:'朱丽叶'，电话:'555-5678'，countMe:假}]});app.directive('conditionalNumberDirective', function(){无功计数器 = 0;返回 {限制:'A'，链接:函数(范围，EL，属性){//在这里通过 attrs 配置什么是 item 什么是 coutMe如果(范围.$index === 0){计数器 = 1;}scope.counter = 计数器；if(angular.isDefined(scope.item) && angular.isDefined(scope.item.countMe) && !scope.item.countMe) {scope.counter = null;}别的 {计数器++}}}});
Html 看起来像
<input type="text" ng-model="search"/><div ng-repeat="arr 中的项目 | filter:search" 条件编号指令>索引:{{$index}} {{item}} - 标签:{{counter}}
Consider the following:
<div ng-repeat='quest in quests'>
<div ng-switch on="quest.ui.type">
<div ng-switch-when="ms-select-single" >
<div ms-select-single quest='quest'
quest-num='{{(true)?numInc():return}}'></div>
</div>
<div ng-switch-when="ms-select-multy">
<div ms-select-multy quest='quest'
quest-num='{{(true)?numInc():return}}'></div>
</div>
<div ng-switch-when="ms-date">
<div ms-date quest='quest'
quest-num='{{(true)?numInc():return}}'>{{questNo}}</div>
</div>
<div ng-switch-when="ms-text">
<div ms-text quest='quest'
quest-num='{{(true)?numInc():return}}'>{{questNo}}</div>
</div>
<div ng-switch-when="ms-textarea">
<div ms-textarea quest='quest'
quest-num='{{(true)?numInc():return}}'>{{questNo}}</div>
</div>
<div ng-switch-when="ms-number">
<div ms-number quest='quest'
quest-num='{{(true)?numInc():return}}'>{{questNo}}</div>
</div>
<div ng-switch-when="ms-html">
<div ms-html quest='quest'></div>
</div>
</div>
</div>
What should be my true statement in the quest-num='{{(true)?numInc():return}}'>?
What i want to achieve is an increment a model value conditionaly when the statement is true, if it's true all the time the program breaks, what should be my true statement here?
numInc returns a ++ of a num value in the model, initialized first at 0, and when it hits the function it increments, but because i have ng-switch it increments too many times, that's why i need the true/false statement, i think...
解决方案
I'm not sure I understood your question but if you wanted something like this
Label Actual $index value
Question 1 0
1
Question 2 2
Question 3 3
etc...
Then we can use a directive. Here's a quick sketch
var app = angular.module('app', []);
app.controller('MainController', function($scope){
$scope.arr = [{name:'John', phone:'555-1276'},
{name:'Mary', phone:'800-BIG-MARY'},
{name:'Mike', phone:'555-4321', countMe:false},
{name:'Adam', phone:'555-5678'},
{name:'Julie', phone:'555-8765'},
{name:'Juliette', phone:'555-5678', countMe:false}]
});
app.directive('conditionalNumberDirective', function(){
var counter = 0;
return {
restrict: 'A',
link: function(scope, el, attr) {
// config what is item and what is coutMe via attrs here
if(scope.$index === 0) {
counter = 1;
}
scope.counter = counter;
if(angular.isDefined(scope.item) && angular.isDefined(scope.item.countMe) && !scope.item.countMe) {
scope.counter = null;
}else {
counter++
}
}
}
});
Html would look something like
<div ng-controller="MainController">
<input type="text" ng-model="search"/>
<div ng-repeat="item in arr | filter:search" conditional-number-directive>
Index:{{$index}} {{item}} - Label:{{counter}}
</div>
</div>
这篇关于如何在 ng-repeat 中跳过 $index的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
查看全文
