Angular 在ajax调用后设置ViewChild

我将元素引用设置为我的输入

export class MyComponent implements OnInit{

    @ViewChild("mySearchElement") // <input #mySearchElement 
    public searchElementRef: ElementRef;

我尝试做的是，我想在ajax调用完成后呈现整个模板。所以我在组件中添加了一个属性

public isDataLoaded = false

我只有在ajax工作完成后才将其设置为真

<div *ngIf="isDataLoaded">
    ....my search element is within this wrapper.

---

这是因为它找不到元素引用。改为使用隐藏属性：

<div [hidden]="!isDataLoaded">
  ...
</div>

---

我找到了解决办法。我将搜索输入带到另一个组件，现在一切正常

<div *ngIf="isDataLoaded">
   <app-location-search location="data.location">...

---

使用[style.display]=isDataLoadedblock'：'none'代替*ngIfI需要使用*ngIf，样式在我的流中不起作用，原因不同。你不能，所以你必须找到另一种方法。要么是style，要么是document.querySelector，我不建议使用后者。请尝试使用@ViewChildren初始化元素。类似的问题，我说它工作了…但造成了其他问题，我的流量。我需要找到一个办法，谢谢你们。

<div [hidden]="!isDataLoaded">
  ...
</div>

<div *ngIf="isDataLoaded">
   <app-location-search location="data.location">...

export class LocationSearchComponent{

    @Input() location: any;

    @ViewChild("mySearchElement") public searchElementRef: ElementRef;

    constructor(public mapsAPILoader: MapsAPILoader) {

    }

    ngOnInit() {

    this.mapsAPILoader.load().then(() => {
        ...