我应该如何配置Angular 8的新子视图?

@ViewChild('searchText', {read: ElementRef, static: false})
public searchTextInput: ElementRef;

vs

@ViewChild('searchText', {read: ElementRef, static: true})
public searchTextInput: ElementRef;

哪个更好?什么时候我应该使用static:true vs static:false?


当前回答

视图的孩子

... 可以使用它作为模板元素参考。

...用于特定组件的外部引用。

使用装饰器样式语法.. @ViewChild(selector)引用:ElementRef || QueryList。

特定组件或元素引用的。

在AfterViewInIt()中使用它。

我们可以在Oninit()中使用它。

但这对于具体使用ngAfterViewInit()。

最后{static: false}应该放在@ViewChild(Useme, {static: false})…模板变量参考。

模板文件中的变量如下所示。 # Useme。

其他回答

所以根据经验,你可以选择以下方法:

当你想在ngOnInit中访问ViewChild时,需要设置{static: true}。 {static: false}只能在ngAfterViewInit中访问。这也是当你在模板中的元素上有一个结构指令(即*ngIf)时你想要做的。

这里是因为升级到Angular 8后,ngOnInit中的ViewChild为空。

静态查询在ngOnInit之前填充,而动态查询(Static: false)在ngOnInit之后填充。换句话说,如果在你设置static: false后,ngOnInit中的viewchild现在是null,你应该考虑将其更改为static: true或将代码移动到ngAfterViewInit。

看到https://github.com/angular/angular/blob/master/packages/core/src/view/view.ts L332-L336

The other answers are correct and explain why this is the case: Queries dependant on structural directives, e.g. a ViewChild reference inside an ngIf, should run after the conditional of this directive has been resolved, ie after change detection. However, one may safely use static: true and thus resolve the queries before ngOnInit for unnested references. Imho this particular case bears mentioning as a null exception could likely be the first way you'll encounter this particularity, as it was for me.

查看子@angular 5+令牌的两个参数('本地引用名',static: false|true)

@ViewChild('nameInput', { static: false }) nameInputRef: ElementRef;

要知道真假之间的区别,检查一下这个

静态——是否在变更检测运行之前解析查询结果(即只返回静态结果)。如果不提供此选项,编译器将退回到其默认行为,即使用查询结果确定查询解析的时间。如果任何查询结果在嵌套视图中(例如*ngIf),查询将在变更检测运行后被解析。否则,它将在变更检测运行之前被解决。

Static属性通知angular子节点的可用性

例如:如果static被设置为true,我们就在一开始就通知angular我们的子元素在页面上是可用的(这意味着它不依赖于*ngIf、页面绑定、API调用等),所以angular会在最早的生命周期钩子(ngOnInit)中寻找它,并且永远不会再寻找它

如果我们将static设置为false,我们就在告诉angular,我们的子函数依赖于一些条件指令,所以angular会在每个变化检测周期后寻找我们的子函数,如果它可用,我们就可以在ngAfterViewInit()生命周期钩子中访问它

在ng8中,你可以手动设置何时访问父组件中的子组件。 当你将static设置为true时,这意味着父组件只能在onInit钩子中获得该组件的定义: 例如:

 // You got a childComponent which has a ngIf/for tag
ngOnInit(){
  console.log(this.childComponent);
}

ngAfterViewInit(){
  console.log(this.childComponent);
}

如果static为false,那么你只能在ngAfterViewInit()中得到定义,在ngOnInit()中,你将得到undefined。