当前位置: 首页 > 知识库问答 >
问题:

如果过滤的搜索不是空的,是否显示?

高自怡
2023-03-14

我目前正在为我的电视节目网络应用程序创建一个实时搜索的过程中。一切都很好。不过,我希望的是,如果筛选的搜索为空,则不显示

我当前的实现不工作。

<div ng-controller="SearchController">

    <div ng-show='shows.length > 0'>

        <h3>Shows you've seen:</h3>

        <hr>

        <ul>

            <li ng-repeat="show in shows | filter: searchbar">

                {{ show.name }}
                <img alt="{{ show.name }}" src="img/artwork/{{ show.image_name }}.png" style="width:50px;height:50px;">

            </li>

        </ul>

        <hr>

    </div>

    <div ng-show='allshows.length > 0'>

        <h3>All TV Shows:</h3>

        <hr>

        <ul>

            <li ng-repeat="allshow in allshows | filter: searchbar">

                {{ allshow.name }}
                <img alt="{{ allshow.name }}" src="img/artwork/{{ allshow.image_name }}.png" style="width:50px;height:50px;">

            </li>

        </ul>

        <hr>

    </div>

</div>
<div ng-controller="SearchController">

    <div ng-hide='searchbar'>

        <h3>Please search something</h3>

    </div>

    <div ng-show='searchbar'>

        <div ng-show="(filtered = (shows | filter:searchbar)).length > 0"> 

            <h3>Shows you've seen:</h3>

            <hr>

            <ul>

                <li ng-repeat="show in filtered">

                    {{ show.name }}
                    <img alt="{{ show.name }}" src="img/artwork/{{ show.image_name }}.png" style="width:50px;height:50px;">

                </li>

            </ul>

            <hr>

        </div>

         <div ng-show="(allfiltered = (allshows | filter:searchbar)).length > 0">

            <h3>All TV Shows:</h3>

            <hr>

            <ul>

                <li ng-repeat="allshow in allfiltered">

                    {{ allshow.name }}
                    <img alt="{{ allshow.name }}" src="img/artwork/{{ allshow.image_name }}.png" style="width:50px;height:50px;">

                </li>

            </ul>

            <hr>

        </div>

    </div>

</div>

匿名用户

你可以做

<div ng-show="(shows|filter:searchbar).length > 0"> 

// content

</div> 

但是这有一个性能问题(多次使用过滤器)。看看如何显示过滤的ng-repeat数据的长度

共有2个答案

冯文彬
2023-03-14
相关问题
姜杜吟
2023-03-14

你可以做

<div ng-show="(shows|filter:searchbar).length > 0"> 

// content

</div> 

但是这有一个性能问题(多次使用过滤器)。看看如何显示过滤的ng-repeat数据的长度

 类似资料:
  • 在 Angular 4 中,我正在尝试迭代一个程序数组。并且还添加了搜索管道。如果未找到搜索,我想显示一条消息。 我该如何处理这个问题? 这是 ngFor 我知道我不能同时使用ngIf和ngFor。有什么方法可以让我使用ngIfElse吗?如果没有找到搜索,则显示一条消息?

  • 问题内容: 每当我在应用程序中搜索时,都会显示正确的结果,但是当我点击搜索的单元格时,在执行搜索之前,它始终会播放表格的第一个索引。我试图在我的didselectcell中使用isSearching Bool,但似乎无法正常工作。 问题答案: 我认为问题在于您正在跟踪自己是否在搜索和操作源数据数组。 我有一个示例游乐场代码段,我已将其用于其他一些答案,该示例向您展示了如何更有效地执行此操作,并提供

  • 问题内容: 我是这个框架的新手,因此练习Angularjs并遵循网站上提供的教程。 有一个示例,我们可以搜索表中存在的数据,示例如下, 在上面的代码中,我可以使用两个不同的输入来搜索手机,即按型号名称搜索和按公司名称搜索,以上代码运行良好, 但是,如果我需要使用选择选项中存在的搜索类型进行搜索,该怎么办? 代码如下 从上面的代码中,您可以看到我正在尝试通过选择框中显示的“姓名”,“公司”或“名称”

  • 我已经花了很多时间弄清楚为什么我的搜索在我定制的模板中不起作用。到目前为止,我已经知道了如何包含searchform。php文件在我的头,创建搜索。php文件目前是空的(因此,当我搜索某个内容时,我会被重定向到一个空白页面,我想我肯定需要search.php文件中的某些内容才能使其正常工作),我阅读了Wordpress codex的所有内容,但找不到解决方案,我找到的唯一有用信息是这个。 http

  • 我的分页工作正常,但是当使用搜索组件时,它只显示结果的第一页。我的页面URL没有搜索看起来像:http://localhost:8000/dictionary-management/postcode?page=2它的工作正确。 带搜索的我的第一页URL:http://localhost:8000/dictionary-管理/邮政编码/搜索和它的工作正常。 带搜索的我的第二页URL:http://l

  • 问题内容: 我正在使用postgreSQL。我有一列: 但是,当我想插入带有空字符串的行时,如下所示: 它不会给我错误并接受。如何检查插入值应为?(既不为空也不为空) PS: 我的专栏定义为: 问题答案: 向列定义添加约束。例如类似: 有关更多信息,请参见http://www.postgresql.org/docs/current/static/ddl- constraints.html