web-dev-qa-db-ja.com

フィルターの後の配列の最初のAngularJS

私のコントローラーで私は呼び出すことができます:

$scope.list[0];

配列の最初の項目にアクセスするには。フィルターを念頭に置いてこれを行う方法はありますか?.

たとえば、私は持っています:

filter:search

繰り返しますが、$ scope.list [0]を呼び出すにはどうすればよいですか。最初の検索結果と同じですか?

16
dab

これは、フィルターの依存関係をコントローラーに注入し、次のようなコードで呼び出すことで実行できます。

var filteredArray = filterDependency(arrayToFilter,args);

新しいフィルタリングされた配列を返します。 「filter」フィルター(名前がfilterであるフィルター)を使用しているため、依存関係の注入はfilterFilterである必要があります。コントローラは次のようになります。

var app = angular.module('myapp',[]);
app.controller('ctrlParent',function($scope,filterFilter){
    var filteredArray = [];
    $scope.list = ["abc","def","ghi","abcdefghi"];
    $scope.$watch('search',function(newValue){
       filteredArray = filterFilter($scope.list, newValue);
       // do something with the first result
       console.log(filteredArray[0]); // first result
    });    
});

ここでは、入力モデル(search)に監視を設定して、新しい値を取得し、入力が変更されるたびに配列を再度フィルター処理します。


また

ビュー内からng-repeatインデックスにアクセスする必要がある場合は、次のように$index内の特別なプロパティng-repeatを使用できます。

<div ng-repeat="item in list | filter:search">
    {{$index}}
</div>

$first$middle、および$lastこのAngular doc に示すように)も使用できます。

デモこれがフィドルです

10
Dan

ブラケットアクセスなし。フィルター付きのng-repeatがある場合:

ng-repeat="thing in things | filter:search"

ここでフィルタリングされたリストは一種の匿名です-アクセスできる名前がありません。

つまり、 docs for ngRepeat を見ると、各リピーターのスコープ内で、$index$first$middle、および$lastにアクセスできることがわかります。

だから何かのような

<body ng-app="App" ng-controller="Main">
    <pre ng-repeat="n in nums | filter:isOdd">
        n={{n}}:index={{$index}}:first={{$first}}:middle{{$middle}}:last={{$last}}
    </pre>
</body>

収まるでしょう:

    n=1:index=0:first=true:middlefalse:last=false

    n=3:index=1:first=false:middletrue:last=false

    n=5:index=2:first=false:middlefalse:last=true

フィドル

3
satchmorun

「ng-repeat」を使っていますか?もしそうなら、プロパティ$ first、$ index、$ middle、および$ lastを見てください。これにより、リピートから特定のアイテムに関する情報を取得できます。

詳細については、こちらを確認してください: http://docs.angularjs.org/api/ng.directive:ngRepeat

0
Aaron Hickman