Angular 2中的交易模型更新

Question

i先前与React/MOBX一起使用动作概念。这允许在一个交易中更改某些模型属性，而无需启动多个事件以更新UI状态（在执行操作方法之后只会触发一个事件）。

在Angular 2中有任何方法或可能是实现相同行为的模式？

Answer 1

我正在使用这样的服务来控制UI：

@Injectable()
export class UIService {
  private buffer: any = {};
  private dispatcher: Subject<any> = new Subject();
  constructor() {
    this.dispatcher
      .asObservable()
      .map(state => this.buffer = { ...this.buffer, ...state })
      .debounceTime(50)
      .subscribe(() => { /* do something */));
  }
  set(key: string, value?: any) {
    this.dispatcher.next({ [key]: value });
  }
}

和ngOnInit()中的不同组件中我设置了不同的选项：

this.uiService.set('footer', false); // in base component
this.uiService.set('footer', true); // in extended component
this.uiService.set('sidebar', true); // in other component
this.uiService.set('title', 'My Page'); // elsewhere...

这样，我只有一个反映我当前UI状态的对象...

Answer 2

请注意，MOBX也可以与Angular 2一起使用：https：//github.com/500Tech/ng2-mobx