在Angular 9中,在ngOnInit中赋值后,对象仍然未定义的问题通常是由于异步操作导致的。你可以使用rxjs中的Observable来处理异步操作,并确保在订阅完成后再进行赋值操作。以下是一个解决方法的示例代码:
component.ts
import { Component, OnInit } from '@angular/core';
import { Observable } from 'rxjs';
@Component({
selector: 'app-your-component',
templateUrl: './your-component.component.html',
styleUrls: ['./your-component.component.css']
})
export class YourComponent implements OnInit {
data: any;
ngOnInit() {
this.getData().subscribe(result => {
this.data = result;
console.log(this.data); // 此处打印的结果应该是正确的数据
});
}
getData(): Observable {
// 模拟异步获取数据的过程,比如通过HTTP请求获取数据
return new Observable(observer => {
setTimeout(() => {
observer.next('Hello, World!');
observer.complete();
}, 2000);
});
}
}
在上述代码中,getData() 方法返回一个Observable对象,模拟了一个异步获取数据的过程。在ngOnInit中,我们通过订阅getData()方法的返回值来获取数据,并在订阅完成后将结果赋值给data属性。这样就可以确保在赋值之前,数据已经被正确地获取到了。
请注意,由于异步操作的存在,你需要在模板中进行数据的null检查,以避免出现undefined的情况:
component.html
{{ data }}
这样,在ngOnInit中赋值后,对象就不会再是undefined了。