javascript - 将数据传递给其他组件的最佳方式是什么

Question

我正在尝试将用户信息对象传递给所有低级别组件， 问题是，即使他们是孙子，将其传递给情人组件的最佳方式是什么？ @input 是否可以工作或者有其他方式来传递它？

我的根组件代码是:

  constructor(private _state: GlobalState,
              private _imageLoader: BaImageLoaderService,
              private _spinner: BaThemeSpinner,  public af: AngularFire) {

    this._loadImages();

    this._state.subscribe('menu.isCollapsed', (isCollapsed) => {
      this.isMenuCollapsed = isCollapsed;
    });

    // this.af.auth.subscribe(
    //   user => this._changeState(user),

    this.af.auth.subscribe( user => this._changeState(user));

  }

Answer 1

您是否考虑过创建一个服务类？它们是单例，因此该类的相同实例会被注入(inject)到每个需要它的组件中。

https://angular.io/docs/ts/latest/guide/dependency-injection.html

一个简单的看起来像这样

import { Injectable } from '@angular/core';

@Injectable()
export class DummyService {
    public userInfo: UserInfo = {
        //User stuff goes here
    };
}

您可以将其添加到这样的组件中。

import {DummyService} from 'dummy.service';

@Component({
  selector: 'my-component',
  templateUrl: 'my.component.html'
})
export class MyComponent{
  constructor(private myDummyService: DummyService){}
}

在运行时，这会将类的相同实例注入(inject)到您注入(inject)它的每个组件中。因此，这是跨多个组件同步数据的 super 方便的方法。