Angular 因ngIf而隐藏组件的参考
我有一个问题div,它使用ngFor生成一些子组件。 这些子组件具有数据的输入字段。当用户在这些字段中输入数据并单击“下一步”按钮时,问题div将使用ngIf隐藏,并显示预览div。再次按下“后退”按钮时,预览div将使用ngIf隐藏,并显示问题div。但因为问题div中的子组件被再次创建,所以来自输入字段的数据就消失了。下面是我的htmlAngular 因ngIf而隐藏组件的参考,angular,angular2-template,angular2-forms,angular2-directives,Angular,Angular2 Template,Angular2 Forms,Angular2 Directives,我有一个问题div,它使用ngFor生成一些子组件。 这些子组件具有数据的输入字段。当用户在这些字段中输入数据并单击“下一步”按钮时,问题div将使用ngIf隐藏,并显示预览div。再次按下“后退”按钮时,预览div将使用ngIf隐藏,并显示问题div。但因为问题div中的子组件被再次创建,所以来自输入字段的数据就消失了。下面是我的html <!-- questions div--> <div class="questions activity_screen
<!-- questions
div-->
<div class="questions activity_screen" *ngIf="showquestions">
<div *ngFor="let component of components;let i=index">
<app-termhost #cmp [term] = component [title]="component.title" [Qnumber]="i+1"></app-termhost>
</div>
<a class="submit_button" (click)="getdata()">Submit</a>
</div>
<!-- preview div-->
<div style="width: 100%;height: 100%;display: flex;align-content: center;justify-content: center" class="preivew" *ngIf="showpdf">
<button (click)="goback()">go back</button>
</div>
提交
回去
如何保持这些组件的先前状态,以便在按下后退按钮后问题div再次出现后数据不会丢失 尝试使用hidden属性而不是*ngIf,hidden将仅使用css,但*ngIf将完全删除元素:
[hidden]="condition"
不使用*ngIf,在css.hidden{display:none}中使用[ngClass]=“{'hidden':condition}”