无法使用 smart-table 中的 select 进行过滤

Question

尝试使用 select 和 ng-options 过滤 table 但未成功.我有一个 plunker 显示问题。谁能看到发生了什么事？

http://plnkr.co/edit/WlojiFw26gqUoEDXOeQd?p=preview

我的Select:

<select class="form-control"
    st-search="code"
    st-input-event="change"
    st-delay="0"
    ng-model="selectedStatusFilter"
    ng-options="f.code as f.text for f in codeOptions">
</select>

我的选择：

$scope.codeOptions = [{
    'text': 'On',
    'code': 'On'
  }, {
    'text': 'Off',
    'code': 'Off'
  }, {
    'text': 'Cat',
    'code': 'Cat'
  }, {
    'text': 'All',
    'code': ''
  }]

collection中的典型项目：

code : "On"
firstName : "Laurent"
id : 9
lastName : "Renard"

所以我希望发生的是 Select 的值被插入为 collection 中项目的代码属性的过滤器。因此，当 "On" 被 selected 时，只显示带有 code : 'On' 的项目，而带有 All selected 的因为那里的值是 "" 我们应该查看所有项目。

使用 Angular 版本 1.6.4
使用 Smart-Table 2.1.8

Answer 1

在智能过滤器文档中有一种方法定义了如何做到这一点，参考 link Smart Table Filtering，所以在这个 link 它告诉我们使用属性 st-set-filter 在智能 table 声明元素上。另一件事是，在 select using ng-options 中我们将获取包含在 select 元素的 ng-model 中的数据类型，要删除它，您可以使用 track by f.code，因此 HTML 变化是：

<section st-table="displayedCollection" st-safe-src="rowCollection" st-set-filter="myCustomFilter"> 
        <select class="form-control"
        st-search="code"
        st-input-event="change"
        st-delay="0"
        ng-model="selectedStatusFilter"
        ng-options="f.code as f.text for f in codeOptions track by f.code"></select>
        {{displayedCollection}}
        <table class="table table-striped">
          <thead>
            <tr>

JS 包含从文档中获取的过滤器声明。

app.filter('myCustomFilter', function($filter){
    return function(input, predicate){
        console.log(input, predicate);
        return $filter('filter')(input, predicate, true);
    }
});

下面是相同的演示。

Plunkr Demo

如果您遇到任何问题，请告诉我！

Answer 2

作为替代方法，您可以使用 <option> 和 ng-repeat 而无需任何 ng-model

 <select class="form-control" st-search="code">
                <option ng-repeat="f in codeOptions" 
                ng-selected="codeOptions.indexOf(f) == 3"
                value="{{f.code}}">{{f.text}}</option>
</select>

Demo Plunker

无法使用 smart-table 中的 select 进行过滤

Can't filter with select in smart-table

angularjs

smart-table