2016-08-29 4 views
0

는 필터링 데이터

HTML

<input type="text" ng-model="searchvalue"> 
<span ng-click="searchbtn()">Search</span> 

JS를 완료

$scope.searchbtn = function() { 
    $scope.loading = true; 
    $scope.mysearchvalue = $scope.searchvalue; 
} 

사용자가 내 데이터를 필터링하고 내가해야 할 키워드 입력 데이터를 필터링 한 후 콜백 함수. 내가 "DOMSubtreeModified"를 사용하고 있지만 복귀 시도

var myElement = angular.element(document.getElementById("mycontent")); 
myElement.bind("DOMSubtreeModified", function() { 
    console.log("keep outputting this message"); 
}); 

enter image description here

+0

왜'$ watch''searchvalue'와 컨트롤러의'$ filter'을 고려? –

+0

안녕하세요 @MikkoViitala 답장을 보내 주셔서 감사합니다. –

+0

그랬습니까 $ scope.items = $ filter ('filter') ($ scope.items2, val); –

답변

1

으로 내 의견에 말했다 로그를 계속 단지 컨트롤러 승/약간의 지연 (디 바운스) 및 필터 결과를 사용하지 이유 별도의 입력 버튼.

HTML 템플릿

<body ng-controller="MainCtrl"> 
    <pre ng-bind="filteredData | json"></pre> 
    <input type="text" ng-model="search" ng-model-options="{debounce:250}"> 
</body> 

자바 스크립트를

angular.module('app', []) 
.controller('MainCtrl', function($scope, $filter) { 
    $scope.data = [{text:'aa'},{text:'ab'}]; 
    $scope.$watch('search', function(val) { 
    $scope.filteredData = $filter('filter')($scope.data, val); 
    }); 
}); 

image