Question

在我的角度项目中，我使用自定义标签（app-movie-card）显示使用ngFor的电影卡片。我使用自定义管道来过滤电影。如果没有匹配的电影来搜索用户，则视图不会按预期显示任何电影卡。在这种情况下，如何显示另一条消息，例如＆＃34;没有符合您输入的电影＆＃34;使用ng-template或其他什么？

谢谢！

Template image

Filter pipe image

Answer 1

如果没有电影，您可以定义一些#elseBlock（您在哪里放置关于没有电影的信息）。

所以，逻辑将是：

<div *ngIf="moviesCount>0; else elseBlock">
  <div *ngFor=""....
</div>
<ng-template #elseBlock>your message here...</ng-template>

REF： https://angular.io/api/common/NgIf#showing-an-alternative-template-using-else

[UPDATE]

一般来说，你不会有过滤/排序的管道。您可能从服务器API获取已排序/有序列表，或者，如果您想在客户端对其进行排序，您将在组件内部使用某些功能对某些属性进行排序/过滤。

在您的特定示例中，一种方法可能是这样的：您将拥有属性movies。然后你会有方法，例如filterByType()和filterByTitle()。这些方法会采用一些数组和过滤条件，因此，他们会将过滤后的数组分配给movies属性。然后，您可以在不使用管道的情况下将movies属性绑定到模板。

第一个显而易见的好处是，您立即知道length（已过滤）数组的movies，您可以检查其是否为0，在这种情况下，您会显示<ng-template>...消息部分

如何检查视图中是否显示角度组件

1 个答案: