我有一个Ionic 4 / Angular 8应用程序,在其中显示模态内部的组件。
例如
const modal = await this.modalController.create({
component: MyComponent,
...
await modal.present();
...
该组件包含一个Form(React式表单),初始化了各种控件,还使用*ngIfs
隐藏/显示了部分。
我将一个@Input()
的编号传递给组件。
我的问题是,当模态打开时,您首先可以看到它未初始化,然后它在设置控件时跳来跳去,UI的位通过*ngIfs
显示/隐藏。
有没有一种方法可以让所有的东西都“隐藏”起来,直到所有的初始化都完成,这样用户就看不到所有的跳跃和控件的设置?
1条答案
按热度按时间sy5wg1nm1#
你至少有两个选择。
1.将所有内容 Package 在
[hidden]="!ready"
中,其中ready
是一个属性,在加载所有内容后将其设置为true。与*ngIf
不同,使用[hidden]
仍将允许加载子组件。这样做的一个小问题是,您必须在真实的的DOM元素上使用
[hidden]
--例如,不能使用<ng-container>
。1.使用OnPush变更检测。
将两者结合起来可能是一个好主意,但您可能会侥幸逃脱任何一个
这两种方法都要求您正在使用的组件知道所有内容何时加载。如果控件此时无法确定这一点,则无论您采用哪种方法,都需要进行更改。