使用*ngIf和angular4自定义管道

我正在使用一个自定义管道，它根据数组字符串中的第一个字母（电话目录样式）过滤数组。每当我更改字母表参数时，管道将返回过滤后的数组，并使用*ngFor显示它。如果没有找到匹配项，则返回空数组，并且我的diplay为空

我希望如果管道返回空数组，我的显示区域应该显示一个div“找不到记录”。我该怎么做呢

<div *ngIf="currentList.length > 0; else nodata" id="outerContainer">
    <div id="listContainer">
        <div class="listItem" *ngFor="let list of currentList | listFilter : listfilterChar" (click)="openContactList()">
            <div class="listInfo">
              <h3>
                {{list.Name}}
              </h3>
          </div>
    </div>
    <div id="alphabetContainer">
      <p *ngFor="let letter of alphabetArray">
        <span class="alphabetContainer" (click)='setListFiltercharacter($event)'>{{letter}}</span>
      </p>
    </div>
  </div>

{{list.Name}

{{字母}}

在上面的代码中，单击span.alphabetContainer，变量listfilterChar将用字母更新，并管道过滤数组。但如果没有找到匹配初始字母表的联系人，则显示区域保持空白。

请尝试此操作

<div class="listItem" *ngFor="let list of currentList | listFilter : listfilterChar" (click)="openContactList()">
    <div class="listInfo">
        <h3>
            {{list.Name}}
        </h3>
    </div>
</div>
<div *ngIf="(currentList | listFilter : listfilterChar).length === 0">
    "No record found"
</div>

{{list.Name}
“未找到任何记录”

接下来，更好的方法是：

<ng-container *ngIf=”(currentList | listFilter : listfilterChar) as result”>

  <div *ngFor=”let item of result”>
    {{item}}
  </div>

  <b *ngIf="!result.length">No record found</b>

</ng-container>

{{item}}
没有找到任何记录

的可能重复，但我认为使用另一个具有否定值的div比这个ngIf-else可读性强得多。嘿，你的else-nodata div在哪里？在那篇文章中，你应该提到你的错误。它将像数组不为空或大于零一样执行，它将显示{{list.Name}}else nodata div。我认为管道没有直接操作currentList数组。它返回一个新数组，因此currentList.length==0，不工作不相关，但Angular2不鼓励使用筛选/排序管道+