Angular JS：$index 类似过滤器的参数

Posted 2023-02-23

【中文标题】Angular JS：$index 类似过滤器的参数

【英文标题】：Angular JS: $index like parameter of a filter

【发布时间】：2013-11-17 01:04:18

【问题描述】：

我想传递变量 $index 类似过滤器的参数。代码如下：

html：

<div ng-app='myApp' ng-controller="Main" >
    <div ng-repeat="i in (filtered = (elements | myFilter: $index))" >

        <ul>
            <il ng-repeat="i in filtered">i.T</il>
        </ul>


    </div>
</div>

JS：

var myApp = angular.module('myApp', [])
.filter("myFilter", function()
    return function(input, index)
        var newArray = [];
        for(var x = 0; x < input.length; x+=2)
             newArray.push(input[index]);   
        
        return newArray;
    
);


function Main($scope)
    $scope.elements = [
         T: 't1', V: "v1",
         T: 't2', V: "v2",
         T: 't3', V: "v3",
         T: 't4', V: "v4",
         T: 't5', V: "v5"
    ];
 

我已经证明，如果我传递一个类似参数的数字，它就可以工作。但是当我传递变量 $index 时，代码不起作用。

有没有像过滤器中的参数一样传递变量 $index 或 ng-repeat 的索引？

您好。

编辑：

真的，我想展示这样的东西：

... t1t2 t3t4 t5 ... 或在 HTML 中：

...

<div>
    <ul>
       <il>t1</il>
       <il>t2</il>
    </ul>
</div>
<div>
    <ul>
       <il>t3</il>
       <il>t4</il>
    </ul>
</div>
<div>
    <ul>
       <il>t5</il>
    </ul>
</div>

【问题讨论】：

你想做什么？增加ng-repeat 步数？

【参考方案1】：

我看不出在过滤器中使用$index 的原因，因为过滤器会遍历所有列表。

但是我会在没有过滤器的情况下实现相同的逻辑，例如：

<div ng-controller = "fessCntrl"> 
<div ng-repeat="i in elements" >
        <ul>
            <il ng-show="$index % 2 == 0">i.T</il>
        </ul>
    </div>
</div> 

演示Fiddle

使用过滤器，您可以编写如下内容：

HTML

<div ng-controller = "fessCntrl"> 
<div ng-repeat="i in elements | myFilter" >
        <ul>
            <il>i.T</il>
        </ul>
    </div>
</div>

JS

.filter("myFilter", function()
    return function(input)
        console.log(input);

        var newArray = [];
        for(var x = 0; x < input.length; x+=2)
             newArray.push(input[x]);   
        
        return newArray;
    
);

演示 2 Fiddle