Angular Переключение NgOnChanges для примитивных логических типов от родительского до дочернего ввода

Question

У меня есть родительский и дочерний компоненты. Родительский компонент пытается отправить тестовый логический флаг на вход дочернего компонента.

Мы пытаемся переключить NgOnChanges в дочернем компоненте, выполнив этот метод.

@Input() Testflag: boolean;
public changeTestFlag(){
    this.TestFlag = false;
    this.TestFlag = true;
}

Однако, это, кажется, вызывает NgOnchanges при вводе дочерних элементов, при отладке и трассировке. Однако, это только читает это как ложь, не правда. Как это можно разрешить для вызова?

Мы можем сделать Object.assign({}, this.testClass) для классов; как мы можем вызвать примитивные логические типы?

Answer 1

Это делается @Input декоратором в Angular. Подробнее читайте здесь https://angular.io/guide/template-syntax#input -and-output-properties

Родительский компонент

В В вашем файле parent-component.ts у вас будет переменная boolean.

testFlag: boolean = true;

А в вашем parent-component.html вы вызовете child-component и передадите значение boolean как attribute.

<child-component [flag]="testFlag"></child-component>

Дочерний компонент

Теперь в вашем child-component.ts вы объявите переменную, исходящую из родительского компонента, используя @Input декоратор.

@Input() flag: boolean; // 'flag' is set in child component as [flag]

И в вашем child-component.html вы можете использовать эту переменную

<p *ngIf="flag">Show Flag</p>