Exploring the capabilities of Angular 2, I have developed a global service that houses an interface. Various components utilize this interface from the global service. When the interface is modified by one component, the changes are reflected in all child components.
Currently, I am attempting to manage this through a pipe. However, when the interface value is altered from a child component, the modifications do not propagate to other components.
The following code snippet represents my progress thus far:
import { Pipe, PipeTransform, EventEmitter } from '@angular/core';
import { GlobalService } from './global-service'
import { MyInterface } from './my-interface'
@Pipe({name: 'myPipe'})
export class MyPipe implements PipeTransform {
private value: string;
private _interface: MyInterface;
private interfaceChanged: EventEmitter<MyInterface>;
constructor(private globalService: GlobalService) {
this._interface = globalService._interface;
this.interfaceChanged = this.globalService
.interfaceChanged
.subscribe((newInterface: MyInterface) => {
this._interface = newInterface;
});
}
transform(value: string, args: any[]): string {
for (var key in this.language) {
if (key == value) {
this.value = this._interface[key];
break;
}
}
return this.value;
}
}
Additionally, a working sample can be found on Plunker