ng-reeat中的角度过滤器——当没有匹配结果时显示消息

Angular filter in ng-repeat -- show message when no matching results

本文关键字:结果 消息 显示 ng-reeat 过滤器      更新时间:2023-09-26

我有过滤功能,可以根据用户的输入和日期比较来过滤模型。我想在该筛选器未返回结果时显示一条消息。我已经看到了这个问题的其他答案,但我似乎无法让它们发挥作用。

以下是我如何进行ng重复设置:

<div ng-repeat="docs in casedocs | filter: filterDocuments | 
                orderBy: userSort : userSortDirection ">
                    <div style="float:left;padding-right:4px;" class="documentRadios">
                        <input type="radio" ng-model="docviews[0].docID" 
                               ng-show="typeOfLaw != 'CV'" value="{{docs.DocID}}" 
                               ng-change="loadDocument(1, 
                                          '{{docs.Description}}', {{docs.DocID}})" />
                        <input type="radio" ng-model="docviews[1].docID" 
                               ng-show="typeOfLaw != 'CV'" value="{{docs.DocID}}" 
                               ng-change="loadDocument(2,  
                                           '{{docs.Description}}', {{docs.DocID}})" />
                    </div>
                    <div class="documentTitle">
                        <a href ng-click="loadDocument(1, 
                                          docs.Description, docs.Doc_ID)">
                          {{docs.Description}}
                        </a>&nbsp;
                        <span class="documentFilingDate">   
                            ({{docs.DocFilingDate}})
                        </span>
                    </div>
                    <div class="documentIcons">
                        <a href="docview/{{docs.DocID}}" target="_blank">
                           <span class="glyphicon glyphicon-new-window white smaller">
                           </span>
                        </a>
                        <span ng-show="docs.Image_Type_ID == 3" class="glyphicon 
                              glyphicon-search white smaller"></span>
                        <span ng-show="docs.Security_Level > 0" class="glyphicon 
                              glyphicon-lock white smaller"></span>
                        <span ng-show="docs.QC_Review_Status == 1" class="glyphicon 
                              glyphicon-ok white smaller"></span>
                    </div>
                    <div style="clear:both;"></div>
                </div>
                <div class="col-sm-8">
                    <span class="notFound white">{{noDocumentsMsg}}</span>
                </div>
            </div>

根据我发现的例子,我应该更改ng重复声明如下:

<div ng-repeat="docs in casedocs = (doc | filter: filterDocuments) 
               | orderBy: userSort : userSortDirection ">

然后使用基于CCD_ 2的CCD_。我看到的示例没有orderBy语句。我在这里做错了什么?

前面给出的答案示例:

假设您的数据在$scope.casedocs中,请尝试:

<div ng-repeat="docs in filteredCasedocs = (casedocs | filter: filterDocuments | orderBy: userSort : userSortDirection)">
    <!-- your code -->
</div>
<div ng-show="!filteredCasedocs.length">None avaialble</div>