그리드를 클릭 할 때 ng-grid 필터링이 영향을받습니다.

Question

ng-grid를 사용하여 표 형식으로 데이터를 표시하는 코드를 개발했습니다. 여기에서는 맞춤 필터를 적용해야합니다. 그리드에는 두 개의 열, 즉 ID와 Title이 있습니다. 또한 제목이 들어있는 제안 입력 상자가 하나 있습니다. 입력 상자에서 제목을 선택하면 선택한 제목을 기준으로 그리드의 데이터가 필터링됩니다.

다음은 기능을 구현하기위한 코드입니다.

HTML

<div ng-app="myApp" ng-controller="MyCtrl"> 
<div class="gridStyle" ng-grid="gridOptions"></div> 
<div style="position: relative; height: 80px;"> 
    <input type="text" name="country" id="autocomplete-ajax" style="position: absolute; z-index: 2; background: transparent;"/> 
    <input type="text" name="country" id="autocomplete" disabled="disabled" style="color: #CCC; position: absolute; background: transparent; z-index: 1;"/> 
</div> 

JS

// binding unique names to the suggestions pluggin for filter. 
    $('#autocomplete-ajax').devbridgeAutocomplete({ 
     lookup: $scope.unique, 
     minChars: 1, 
     onSelect: function (suggestion) { 
      console.log(suggestion); 
      $scope.filterSearch('Title',suggestion.value); 
     }, 
     showNoSuggestionNotice: true, 
     noSuggestionNotice: 'Sorry, no matching results'    
    }); 

// configuring ng-grid options 
    $scope.gridOptions = { 
     data: 'videoColl', 
     showGroupPanel: false, 
     jqueryUIDraggable: false, 
     showFilter: false,   
     multiSelect:false, 
     filterOptions: $scope.filterOptions 
    }; 
    $scope.filterSearch = function(searchField,searchText) { 
    var filterText = searchField + ':'+ searchText; 
    $scope.filterOptions.filterText = filterText;  
    }; 

나는 그것이 데이터를 필터링하지만 변화가 그리드에서 순간 때를 표시하지 않는 autocomplete-ajax에서 어떤 제목을 선택 제목을 선택하는 대신 데이터가 표에서 변경됩니다. 제목을 선택한 후 표를 클릭합니다.

완벽하게 작동하려면 무엇이 누락 되었습니까?

Answer 1

필터 데이터를 변경하면 $scope.$apply() 전화가 누락되었습니다.

jQuery는 각도 범위를 벗어 났으므로 수동으로 다이제스트주기를 호출하여 html에 데이터 변경 사항을 적용해야합니다.