今回はAnuglarでよく使うfilterという機能です。
使いどころとしては入力フォームに対応させて表示項目を絞る、みたいな使い方が一般的かと思います。
一番簡単なものとしては配列があり、入力値にあわせてそれを絞るみたいなものでしょう。(下記参照)
|
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 |
<!doctype html> <html> <head> <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.4/angular.min.js"></script> <script> var app = angular.module('myApp', []); app.controller('myController', function($scope) { $scope.dataList = [ 'yamada tarou', 'satou ichirou', 'satou tarou' ]; }); </script> </head> <body> <div ng-app="myApp"> <div ng-controller="myController"> <input type="text" ng-model="search_word"> <table> <tr ng-repeat="data in dataList | filter:search_word"> <td>{{data}}</td> </tr> </table> </div> </div> </body> </html> |
参考リンク
filter以外にもng-repeatの機能をいろいろと紹介してくれています。
