Question

我有一个角度应用程序（TypeScript）设置，其中父组件包含其中的另一个子组件。 City组件（子组件）发出Ajax请求以加载大约2秒的数据（城市）。

@Component({
    providers: [UserService],
    template: `<city [city]='user.city' (citySelected)="user.city = $event"></city>`

})
export class FormComponent implements OnInit{ 

    private user:User = new User();

....

问题，我要求城市组件首先加载到父组件之前。

Answer 1

考虑到Angular 2如何处理组件交互，您的子组件应首先加载。

我发现您正在尝试从父组件初始化User对象。考虑Angular 2的工作原理，您的子组件将首先加载，并且无法访问user.city。最简单的解决方案是在模板中添加*ngIf以延迟子组件的初始化，以便等待加载User对象。

以上是上述问题的摘录，其中包含我提到的解决方案。

@Component({
providers: [UserService],
template: `<city *ngIf="user" [city]='user.city' 
(citySelected)="user.city = $event"></city>`

})

export class FormComponent implements OnInit{ 

    private user:User = new User();

}

如果有人需要更多澄清，请告诉我。干杯！

如何在父亲之前加载子组件

1 个答案: