文章/答案/技术大牛

发布

社区首页 >问答首页 >检查“不在”列表条件角2模板

问检查“不在”列表条件角2模板
EN

Stack Overflow用户

提问于 2017-08-31 05:59:31

回答 4查看 4.1K关注 0票数 3

我有一个模板如下：

<span *ngIf="item.status !=='E1' && item.status !=='B' && item.status !=='R'">{{item.status_desc}}</span>

如前所述，我有一个ngIf条件，没有任何意义，但不知何故起作用了。我想要做的是检查“E1，B，R中的状态”之类的东西。我怎样才能在html中做到这一点而不进入ts文件。伙计们有什么想法吗？

html

angular

list

回答 4

Stack Overflow用户

回答已采纳

发布于 2017-08-31 06:08:48

如果您真的不想访问您的TypeScript源代码，您可以这样做以提高可读性。

<span *ngIf="!['E1', 'B', 'R'].includes(item.status)">{{item.status_desc}}</span>

但是，也许在类中使用“不想要的”状态创建一个变量更明智，比如：

public ignoreStatus: string[] = ['E1', 'B', 'R'];

然后

<span *ngIf="!ignoreStatus.includes(item.status)">{{item.status_desc}}</span>

但是，在您的类中创建一个可重用的方法就更好了：

public isIgnoreStatus(item: any): boolean {
    return this.ignoreStatus.includes(item.status);
}

使用

<span *ngIf="!isIgnoreStatus(item.status)">{{item.status_desc}}</span>

票数 3

Stack Overflow用户

发布于 2017-08-31 06:09:01

在HTML中，可以使用includes()，如果找到元素，则返回true：

<span *ngIf="!['E1', 'B', 'R'].includes(item.status)">{{item.status_desc}}</span>

正如JB Nizet所建议的。

或者你可以用一个函数，像这样：

statusList = [E1, B, R];
checkStatus(item)
{
  return (statusList.indexOf(item) != -1);
}

您的HTML现在应该是这样的：

<span *ngif="checkStatus(item.status)">{{item.status_desc}}</span>

票数 4

Stack Overflow用户

发布于 2017-08-31 06:03:40

不，您不能用模板来完成这个任务，您可以做的是创建一个为您完成任务的函数。

statuses = [E1, B, R];
checkValid(item){
  return (statuses.indexOf(item) != -1);
}

然后在HTML中

<span *ngIf="checkValid(item.status)">{{item.status_desc}}</span>

票数 0

页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持

原文链接：

https://stackoverflow.com/questions/45974252

复制

相似问题

问检查“不在”列表条件角2模板
EN

回答 4

Stack Overflow用户

Stack Overflow用户

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问检查“不在”列表条件角2模板EN

回答 4

Stack Overflow用户

Stack Overflow用户

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问检查“不在”列表条件角2模板
EN