【问题标题】:ngOnInit is faster than @InputngOnInit 比 @Input 快
【发布时间】:2019-11-27 08:17:00
【问题描述】:

我有一种情况,我正在使用 @Input 将值从父组件传递到子组件。问题是在子组件中触发 ngOnInit() 之前我没有从父亲那里得到值。所以发生的情况是,当 ngOnInit() 尝试使用其“未定义”值执行 sg 时,一秒钟后该值已填充但 ngOnInit() 已经完成。我希望它足够清楚。

有什么方法可以使这两者同步,首先我获取数据而不是填充元素?

         @Input('data')
      set data(value) {
        this._data = value;
         this.noActivityData = (this._data === null || this._data === undefined);
      }

ngOnInit() {

     if(this._data){
       elements.activeTimeDistribution.selected = !this.noActivityData;
       elements.stepsDay.selected = !this.noActivityData;
       elements.walkingSpeed.selected = !this.noActivityData;
       elements.activeTimeDistribution.disabled = this.noActivityData;
       elements.stepsDay.disabled = this.noActivityData;
       elements.walkingSpeed.disabled = this.noActivityData;

     }

    });
  }

【问题讨论】:

  • 你能不能试着把你的 @Input() 放在构造函数中,因为它是在 ngOnInit() 之类的任何东西之前“加载”的
  • 为什么不调用 set data 中的函数“init”而忘记 ngOnInit()?

标签: angular angular6 ngoninit


【解决方案1】:

一种选择是将 *ngIf 添加到您的子组件中,并且仅在父组件获得您想要传递的值时才呈现它

<app-child-component
*ngIf="variable_you_want_to_pass_through">
</app-child-component>

您也可以使用 ngOnChanges,并在此处的 ngOnInit 方法中运行您想要运行的任何内容,因为如果父值更改,这将触发。

https://angular.io/api/core/OnChanges

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 2018-07-26
    • 2018-06-22
    • 2019-07-08
    • 1970-01-01
    • 1970-01-01
    • 2016-09-22
    • 1970-01-01
    • 2017-10-18
    相关资源
    最近更新 更多