在角度上,有一个内置的动作对话框框架,当showDialog = true时,我不得不使用它来显示动作弹出窗口。
动作对话框将在showDialog=true时显示,否则动作对话框将在showDialog=false时隐藏。
当showDialog = false时,必须使用setter和getter方法调用cancel方法。
但是,在调试代码时,它会继续检查getter和setter方法,即使我没有触发操作对话框。
有什么方法可以用生命周期方法在角比较以前的值和当前的布尔值的showDialog。示例:如果previousValue.showDialog != currentValue.showDialog,则只调用get showDialog()、设置showDialog()和cancel()。
我正在考虑在ngAfterViewInit()这样的角度上使用一些生命周期方法。您知道如何存储以前的showDialog布尔val,以便与当前的showDialog val进行比较。
在React中,我可以使用具有prev支持值的getDerivedStateFromProps,但是您知道在角中是否有类似的方法。
a.html
<action-dialog [(openDialog)]="showDialog"/>b.html
<button (click)="showDialog = true">
{{intl.cleanNow | uppercase}}
</button>a.ts
get showDialog() {
return this._showDialog;
}
set showDialog(val){
if (val === false) {
this.cancel();
} else if (val === true) {
this._showDialog = true;
}
}
cancel() {
this.showDialog = false;
this.form.reset({
throttle: this._originalThrottle || 50
});
}发布于 2019-06-25 21:40:24
您可以使用ngOnChanges生命周期挂钩。这个生命周期挂钩得到一个类型为simpleChanges的变量,其中一个值是以前的值。
@Component({
selector: 'app-test',
templateUrl: './test.component.html',
styleUrls: ['./test.component.scss']
})
export class TestComponent implements OnInit, OnChanges {
@Input() test: string;
constructor() { }
ngOnChanges(changes: SimpleChanges) {
console.log(changes);
}
ngOnInit() { }
}从父组件中调用此组件的方式如下:
<app-test [test]="'2'"></app-test>这将是控制台:
测试: SimpleChange,currentValue:"2",firstChange: true,previousValue:未定义
因此,您可以知道当前值,前一个值,即使这是第一次更改或不知道。
https://stackoverflow.com/questions/56762228
复制相似问题