要解决在OnInit函数中自定义元素属性为undefined的问题,可以按照以下步骤进行:
import { Component, Input, OnInit } from '@angular/core';
@Component({
selector: 'app-custom-element',
template: '{{ customProp }}'
})
export class CustomElementComponent implements OnInit {
@Input() customProp: string = undefined;
ngOnInit() {
console.log(this.customProp); // 输出undefined
}
}
import { Component } from '@angular/core';
@Component({
selector: 'app-parent-component',
template: ' '
})
export class ParentComponent {
parentProp: string = 'Hello Angular';
constructor() {
setTimeout(() => {
this.parentProp = 'Hello World';
}, 2000);
}
}
这样,当父组件中的属性值发生变化时,会自动更新子组件的自定义属性值。
注意:OnInit函数只在组件初始化时调用一次,如果在OnInit函数中访问自定义属性,而该属性在组件初始化之前没有被赋值,则其值将为undefined。如果要在属性值变化时执行逻辑,可以考虑使用ngOnChanges函数。