首先我将提供背景信息,然后显示一些代码片段。
我有一个 ng-repeat,它是重复的类似盒子的小部件,里面有数据/信息。
我有一个搜索栏,可以过滤小部件中的数据,并且仅显示包含搜索栏中字符串的小部件。
考虑到数字 2,当输入的字符串不在任何小部件中时,它会将页面留空,没有小部件。 (它使没有该字符串的小部件消失)
我想要的是:在没有返回结果时显示一个div,而不是显示一个空白页面。
为了举例,我有:
<input type = "text" data-ng-model = "searchWidgets" />
<div id="main-content-body" data-ng-repeat="widget in widgets | filter:searchWidgets">
<div id="falsy-search" ng-show="!searchWidgets.length">
<h1 id="inset-message" class="text-center">No Results Found</h1>
</div>
<section>
(this is where all the widgets get displayed)
</section>
</div>
预先感谢您的时间和投入!
最佳答案
你可以有几个选项,最简单的一个是将filteredWidgets保存为其自己的对象,然后使用ng-show:
<div id="main-content-body" data-ng-repeat="widget in (filteredWidgets = (widgets | filter:searchWidgets))">
<div id="falsy-search" ng-show="!searchWidgets.length || filteredWidgets.length == 0">
<h1 id="inset-message" class="text-center">No Results Found</h1>
</div>
<section>
(this is where all the widgets get displayed)
</section>
</div>
关于javascript - 当过滤的搜索栏不返回任何内容时,如何 ngShow a div?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/30109751/