要更新给定对象,您可以使用Angular的异步管道和RxJS来实现。以下是一个示例代码:
在组件中,定义一个对象并使用BehaviorSubject
来创建一个可观察对象:
import { Component, OnInit } from '@angular/core';
import { BehaviorSubject } from 'rxjs';
interface MyObject {
name: string;
age: number;
}
@Component({
selector: 'app-my-component',
template: `
Name: {{ myObject$ | async }}
Age: {{ (myObject$ | async)?.age }}
`,
})
export class MyComponent implements OnInit {
myObject$: BehaviorSubject;
ngOnInit() {
this.myObject$ = new BehaviorSubject({ name: 'John', age: 25 });
}
}
然后,您可以在组件中使用async
管道来订阅可观察对象并在模板中显示更新后的对象属性。
要更新对象,您可以创建一个方法来修改BehaviorSubject
的值:
updateObject() {
const updatedObject = { name: 'Alice', age: 30 };
this.myObject$.next(updatedObject);
}
在模板中,您可以将该方法与一个按钮绑定,以便在点击按钮时更新对象:
这样,当您点击按钮时,对象的属性将更新,并在模板中显示出来。
上一篇:Angular 异步管道
下一篇:Angular 异步数组模型