在ngFor中隐藏/显示页面加载时的单个项目

时间:2018-06-15 01:48:14

标签: angular angular-ngfor

我的问题也很相似this one

不同之处在于:我必须首先根据默认语言显示textarea,然后使用所选语言。我每种语言都有一个textarea,一次只能显示一个。我可以应用Thierry Templier的答案来获得类似标签的行为而没有任何问题。

这里的代码: 我使用默认语言渲染一组单选按钮选项。

<div *ngFor="let language of model.appLanguages" style="display:inline">
    <input type="radio" name="title"
           id="language.languageId"
           [checked]="language.isDefault" /> {{ language.displayName }} 
  </div>

然后我必须首先根据默认语言显示textarea,然后使用所选语言

<div [(hidden)]="showDefaultFirst(text.languageId)" class="row" *ngFor="let text of model.texts">
  <div id="{{text.languageId}}" class="col-sm-12">
    <editor [(ngModel)]="text.content" [ngModelOptions]="{standalone: true}" apiKey="..."></editor>
  </div>
</div>

背后的代码就像Thierry Templier的答案。 知道如何根据默认值添加额外的步骤来隐藏页面加载元素吗?

1 个答案:

答案 0 :(得分:0)

您需要使用* ngIf并检查条件并渲染必要的模板。

^(?:(.)(?!\1\1))+$