scrollview - 如何修复在 NativeScript Angular 中未定义的 @ViewChild ElementRef？

Question

我正在使用 NativeScript (CLI v5.2.0) Angular (v7.2.3) 开发移动应用程序，并且我的 @ViewChild ElementRef 未定义。

我在“@angular/core”的导入中检查了 ViewChild 和 ElementRef 的存在，重命名了我的 @ViewChild 变量，将范围从公共(public)更改为私有(private)，在 ngAfterViewInit 中移动了 console.log()(参见:https://github.com/NativeScript/nativescript-angular/issues/188#issuecomment-212815619)和用“tns debug android --clean --bundle”重建了我的项目。

component-name.component.ts :

@ViewChild("test") private _scrollView: ElementRef;

constructor(page: Page) {

    page.actionBarHidden = true;

}

ngAfterViewInit() {

    console.log("ScrollView element:", this._scrollView.nativeElement);

}

...

component-name.component.html :

<GridLayout columns="*" rows="*, auto">

    <ScrollView (swipe)="onSwipe($event)" col="0" row="0" #test>
        <StackLayout>

...

如果我将#test 放在开头，就在 ScrollView 元素之后，我有未定义的“this._scollView”变量。

如果我把 #test 放在最后，就像上面的例子一样，一切正常，我在 console.log(this._scrollView.nativeElement) 中显示我的元素!

一个错误？

Answer 1

Previous code:

import { ElementRef } from "@angular/core";

@ViewChild("myElement") myElement: ElementRef;

Migrated code:

import { ElementRef } from "@angular/core";

@ViewChild("myElement", { static: false }) myElement: ElementRef;

{static: false} means nfAfterInit,
{static: true} mean ngInit

its works for me.