Question

我开发了一个使用ng-grid以表格格式显示数据的代码。在这里，需要应用自定义过滤器。有两列，即网格中的ID和标题。还有一个包含标题的建议输入框。当从输入框中选择任何标题时，应根据所选标题过滤网格中的数据。

以下是实现功能的代码。

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。

单击网格时会影响网格过滤

1 个答案: