Question

我在ngFor循环中有一些元素。他们中的一些人有工具提示而另一些人没有。当我使用以下代码时：

<div ngFor="let item of items">
    <div [title]="item.title">

没有工具提示的项目会显示undefined。有没有办法隐藏它，如果该项目没有其他项目＆＃39;工具提示仍然可以显示？

Answer 1

如果未定义||，请使用item.title运算符将默认值设置为空字符串。这将阻止显示工具提示。 this stackblitz中显示了一个示例。

<div [title]="item.title || ''"> Some content </div>

Answer 2

我想我会添加另外两种方法，如果你不知道，你也可以这样做：

<div [title]="getTitle()"> Some content </div>

然后在你的打字稿中：

public getTitle(): string{
   return item.title || '';
}

除此之外，您还可以利用打字稿getter/setters：

export class Item{
  private _title:string;
  get title():string {
      return this._title || '';
  }
  set title(value:string) {
      this._title = value;
  }
}

这样，标题永远不会返回null或undefined。

在Angular 2中动态隐藏/显示工具提示

2 个答案: