Question

有一个包含数据的表和一个必须根据选择器中的选择过滤数据的选择器，我想显示一条消息（＆＃34; No data＆＃34;）如果过滤没有返回数据

选择器如下所示：

    'Paginator' => array(
        'limit' => 15,
        'paramType' => 'querystring'
    ),

表格在这里生成：

<select ng-model="$ctrl.type">
    <option value="">All</option>
    <option value="1">1</option>
    <option value="2">2</option>
    <option value="3">3</option>
</select>

myData是一个对象数组，如：

<tbody>
    <tr ng-repeat="rows in $ctrl.myData | filter: {Type: $ctrl.type} track by $index">
        <td>
            <span>{{rows.Type}}</span>
        </td>
        <td>
            <span>...</span>
        </td>
    </tr>
</tbody>

它现在可以正常工作，但是当我选择myData = [ {Type: "1", SiteId: 8, SiteName: "aaa"}, {Type: "1", SiteId: 7, SiteName: "asb"}, {Type: "2", SiteId: 1, SiteName: "aaa"}, {Type: "1", SiteId: 17, SiteName: "x"}, {Type: "2", SiteId: 7, SiteName: "xx"} ];时，它会显示表格标题而没有数据。我想在这种情况下显示一条消息而不是表头。

我尝试用这样的3包围ng-repeat：

ng-if

但它对它没有任何影响。

如果选定的<tbody> <div ng-if="$ctrl.myData.filter(s => s.Type == $ctrl.type).length > 0"> <tr ng-repeat=...> ... </tr> </div> <div ng-if="$ctrl.myData.filter(s => s.Type == $ctrl.type).length == 0"> NO DATA FOR THIS OPTION </div> </tbody>没有数据，有关如何显示消息的任何建议吗？

Answer 1

如上所述，回答here您可以按照以下方式更新您的代码。我希望它能解决你的问题

<tbody>
         <tr ng-repeat="rows in filteredData = ($ctrl.myData | filter: {Type: $ctrl.type} track by $index">
            <td>
                <span>{{rows.Type}}</span>
            </td>
            <td>
                <span>...</span>
            </td>
        </tr>
        <div ng-hide="filteredData.length"> 
            NO DATA FOR THIS OPTION
        </div>
    </tbody>

Answer 2

尝试："rows in $ctrl.myData | filter: {Type: $ctrl.type} as filtered track by $index " 在你的桌子下<div ng-if="!filtered.length">No results</div> https://plnkr.co/edit/diNlE0lS8eFttvgBUHug?p=preview

如果过滤返回空结果，则过滤器不显示消息而不显示表

2 个答案: