Angular 简单指令 ngIf答案

【问题标题】：Angular Simple Directive ngIfAngular 简单指令 ngIf
【发布时间】：2018-07-19 13:39:39
【问题描述】：

我不知道如何用角度来写我的条件，我找不到一个等价的例子。

我怎样才能听到我的材料选择？

我如何写一个 ngIf 条件？

{{referentielToDisplay.speSS}} 的值与我的 toppingList 之一相同，我想写：

如果ReferentielToDisplay。 speSS 等于在材料选择中选择的项目所以：显示此卡

*ngIf="referentielToDisplay.speSS === topping"

组件.html

<mat-form-field style="width:100%" appearance="outline">
  <mat-label>Sélectionner une spécialité</mat-label>
  <mat-select placeholder="Toppings" [formControl]="toppings" multiple="true" >
    <mat-option *ngFor="let topping of toppingList" [value]="topping" >{{topping}}</mat-option>
  </mat-select>
</mat-form-field>

<div  *ngFor="let referentielToDisplay  of referentielsToDisplay | async" >
<mat-card *ngIf="referentielToDisplay.speSS === topping">
{{referentielToDisplay.nomSS}}
</mat-card>
</div>

组件.ts

toppings = new FormControl( );
toppingList: string[] = ['Multi-spécialité','Hématologie', 'Neurologie', 'Urologie', 'Digestif', 'Endocrinologie',  'Pneumologie', 'ORL','Dermatologie', 'Sein-Gynecologie'];

【问题讨论】：

不清楚。什么是“我的数据”？什么是“我的桌子”？ toppingdefined 在哪里？您是在问如何测试 toppingList 是否包含 referentielToDisplay.speSS？看数组的文档：developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/…
在您比较超出范围的和
中不是“顶部”吗？检查“顶部”的可见性
我怎样才能听到我的垫子选择的顶部？

标签： angular angular-material2 angular-ng-if

【解决方案1】：

您可以尝试indexOf 条件：

<mat-card *ngIf="toppingList.indexOf(referentielToDisplay.speSS) > -1">
  {{referentielToDisplay.nomSS}}
</mat-card>

或者

<mat-card *ngIf="toppingList.includes(referentielToDisplay.speSS)">
  {{referentielToDisplay.nomSS}}
</mat-card>

Ìt 检查列表是否包含您的值 referentielToDisplay.speSS

【讨论】：

谢谢我重新提出了我的问题，因为我想要 *ngIf="{{referentielToDisplay.nomSS}}.indexOf(topping) > -1" 但如果不起作用
去掉那些双花括号。注意数组中有一个includes方法：developer.mozilla.org/fr/docs/Web/JavaScript/Reference/…
是一样的。我认为我的问题是听垫选择
您的问题是您的问题非常不清楚，您没有回答问题，也没有使其更清楚。所以基本上帮不了你。
哎呀抱歉那是toppingList.indexOf(referentielToDisplay.speSS)

【解决方案2】：

*ngIf="toppings.value.includes(referentielToDisplay.speSS)"

这不是完全的解决方案，而是方法！

【讨论】：

直接toppings.value && toppings.value === referentielToDisplay.speSS
谢谢朱利安！！
Pas de soucis ！ ;)
@JulienMetral Tu es développeur sur angular ? pourrion nous discuter sur le chat ?