javascript - Angular: applying filters to a ng-repeat -
i'm trying apply filter array, changes in js, changes in html (due two-way-binding). controller i'm using:
app.controller('controlador1', ["filterfilter", "$scope", function(filterfilter, $scope) { this.array = [ {name: 'tobias'}, {name: 'jeff'}, {name: 'brian'}, {name: 'igor'}, {name: 'james'}, {name: 'brad'} ]; var active = false; $scope.applyfilter = function(){ if(!active){ $scope.arrayfiltrado = filterfilter(this.array, "a"); active = true; }else{ $scope.arrayfiltrado = this.array; active = false; } } $scope.arrayfiltrado = this.array; }]); also, html template:
<!doctype html> <html ng-app="miapp"> <head> <meta charset="utf-8"> <script src="angular.js"></script> <script src="mainmodule.js"></script> <link rel="stylesheet" href="bootstrap/css/bootstrap.css"> </head> <body ng-app="miapp" ng-controller="controlador1"> <button type="button" class="btn btn-default" ng-click="applyfilter()">button</button> <span ng-repeat="elem in arrayfiltrado">{{elem.name+" "}}</span> </body> </html> i want apply/deactivate filter when click button, no matter do, if click button, nothing shows @ html. it's if array got erased.
can tell me i'm missing here?
you can use angular binding it. avoid code on controller , simplify logic.
js
app.controller('controlador1', ["filterfilter", "$scope", function(filterfilter, $scope) { $scope.active = false; $scope.arrayfiltrado = [ {name: 'tobias'}, {name: 'jeff'}, {name: 'brian'}, {name: 'igor'}, {name: 'james'}, {name: 'brad'} ]; $scope.filtering = function(item) { if(!$scope.active) { return true; } return item.name.indexof('a') !== -1; } }]); html
<body ng-app="miapp" ng-controller="controlador1"> <button type="button" class="btn btn-default" ng-click="active = !active">button</button> <span ng-repeat="elem in arrayfiltrado | filter:filtering">{{elem.name+" "}}</span> </body>
Comments
Post a Comment