angular - ngAfterViewInit中的 typescript 分配变量不起作用

我正在尝试创建一个角度4的组件，遇到了一个非常奇怪的问题，我似乎无法解决。
我有一个简单的boolean我试图设置基于@Input

@Input('type') inputType: string = 'text';
showTextInput: boolean = false;
...
 ngAfterViewInit() {
    console.log('input', this.inputType);
    this.showTextInput = this.inputType === 'text' ? true : false;
    console.log('after condition', this.showTextInput);
}

这个组件的html是

<ts-input-item formControlName="name"
               [control]="programForm.controls.name"
               [label]="'Name'"
               (onUpdateClicked)="updateItem($event,'Name','name')">
</ts-input-item>

所以在它当前的形式下，它应该默认输入text，它确实是这样，这是因为我变得非常困惑。下面是console.log打印。

所以现在this.showTextInput等于true。但是如果我在组件中像这样使用它

  <ion-input #input
             [type]="inputType"
             [disabled]="isSelect"
             (keyup)="itemValueChanged(input.value)"
             (keyup.enter)="itemUpdate()"
             *ngIf="showTextInput">
  </ion-input>

然后部件完全断裂。主要是因为它不显示为父组件不处理传递的表单名称，而简单地说，如果我添加

<div *ngIf="showTextInput"> foobar </div>

foobar文本将不会显示，并且没有错误。我是否在正确的生命周期挂钩中处理通行证？

最佳答案

显式调用更改检测可能有助于：

constructor(private cdRef:ChangeDetectorRef) {}

ngAfterViewInit() {
    console.log('input', this.inputType);
    this.showTextInput = this.inputType === 'text' ? true : false;
    console.log('after condition', this.showTextInput);
    this.cdRef.detectChanges();
}

关于angular - ngAfterViewInit中的 typescript 分配变量不起作用，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/43801228/