使用*ngif和angular4自定义管道

Question

我正在使用一个自定义管道，过滤数组的第一个字母表在字符串的基础上数组（电话簿样式）。每当我更改字母表参数时，管道就会返回经过过滤的数组，并使用*ngfor显示它。如果没有找到匹配项，则返回空数组，并且我的diplay are为空。

我希望，如果管道返回空数组，我的显示区域应该显示一个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>

Answer 1

试试这个

<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>