我需要澄清服务和组件属性之间的绑定以及angular2
中的数据绑定假设我有一个服务(单身)和一个组件
export class Service {
name = "Luke";
object = {id:1};
getName(){return this.name};
getObject(){return this.object};
}
export class Component implements OnInit{
name:string;
object:any;
constructor(private _service:Service){}
ngOnInit():any{
//Is this 2 way binding?
this.name = this._service.name;
this.object = this._service.object;
//Is this copying?
this.name = this._service.getName();
this.object = this._service.getObject();
}
}
答案 0 :(得分:7)
Angular绑定仅适用于在视图(HTML)中声明的绑定。
如果您希望在服务中的值发生更改时更新组件中的属性,则需要自己处理。
Observables让这很容易。有关示例,请参阅detect change of nested property for component input。
答案 1 :(得分:6)
如果您通过引用更新元素(如果您将某些内容更新到object
属性中),您将在视图中看到更新:
export class Service {
(...)
updateObject() {
this.object.id = 2;
}
}
如果按值更新元素(如果您将某些内容更新到name
属性中),则您无法在视图中看到更新:
export class Service {
(...)
updateName() {
this.name = 'Luke1';
}
}
请参阅此plunkr:https://plnkr.co/edit/w7bS0fAVjOc3utnpD39b?p=preview。
答案 2 :(得分:-1)
如果您希望在服务更改中的值更改后更新组件中的属性:
DoCheck
和@angular/core
导入service
到{。}}
组件。ngDoCheck(){...}
你的组件中有这样的东西:
ngDoCheck() {
this.qty = this.cartService.getTotalQtyInCart();
}