我有一个由两个标签组成的表格
基于* ngIf,我决定要显示哪种标签。
- 如果我的表单是一个视图,我想看到两个标签都带有标签(两个标签都有显示用户的信息,第二个标签是结果)。
- 如果我的表单是添加,我希望看不到标签,因此没有标签。
我不想创建两个单独的文件,因为我试图尽可能地减少代码。
我尝试添加替换mat-tab-label的ng-template,但是我的标签是空的,而不是删除它。
到目前为止,这就是我所拥有的。我的问题是:是否可以在不创建新文件的情况下删除整个标签标签,如果是,我该怎么办?
<mat-dialog-content class="ManageTask">
<form [formGroup]="form">
<mat-tab-group mat-stretch-tabs>
<mat-tab>
<ng-template *ngIf="isView()" mat-tab-label>Task details</ng-template>
<div class="left">
<mat-form-field class="full-width">
<input matInput type="text" placeholder="Name" formControlName="name">
<mat-error *ngIf="form.controls['name'].hasError('required')">Name required</mat-error>
</mat-form-field>
<br/>
<mat-form-field class="full-width">
<textarea matInput type="text" placeholder="Description" formControlName="description"></textarea>
<mat-error *ngIf="form.controls['description'].hasError('required')">Description required</mat-error>
</mat-form-field>
</div>
</mat-tab>
<mat-tab *ngIf="isView()" label="Task results">
<div>...MORE CONTENT...</div>
</mat-tab>
</mat-tab-group>
</form>
答案 0 :(得分:0)
我不确定我是否理解这个问题。当然你可以这样做。正确使用<ng-template>
和ngIf
这样的方式:
<ng-template [ngIf]="isView()">
<mat-tab label="Task details">...</mat-tab>
</ng-template>
或:
<mat-tab *ngIf="isView()" label="Task details">...</mat-tab>
[ngif]
和*ngif
之间的差异:Angular Structural Directives
希望有所帮助