要停止重新创建组件并在Angular2中保留组件数据吗

我使用的是angular2 webpack starter，因为“2.0.0-rc.1”中的路线还不是标准路线，他们使用@angular2/Route Debricated进行路线选择。现在

这是我的服务

@Injectable()
export class JSTreeService {

  constructor(private http: Http) {

  }
  // Uses http.get() to load a single JSON file
  getData(): Observable<IDataItem[]> {
    return this.http.get('url')
      .map((res: Response) => res.json());

  }


}

这是共享服务

@Injectable()
export class SharedData {
  constructor() {

  }
  dataItem:IDataItem[];


}

这是我的item.template

<div class="">
  <label *ngFor="let item of dataItem"> <input type="checkbox" name="checkbox" value="value"> {{item.text}} <br></label>
</div>

---

是的，我正在使用webpackstarter工具包中的@angular/router去润滑，将数据保存在服务中，并在重新创建组件时从那里获取数据（当您使用此组件路由回路由时）

对于导航仅更改参数值的情况，您可以实现并返回

true

，因此路由器不会在这种情况下处理和重新创建组件

routerCanReuse(nextInstruction: ComponentInstruction, prevInstruction: ComponentInstruction) : boolean |
<boolean> {
  return true; 
}

routerCanReuse（下一条指令：组件指令，前一条指令：组件指令）：布尔值|
{
返回true；
}

---

这还没有在新的

RC.1

路由器中实现。

我在一开始就编辑了我的问题描述，并在下面更新了我的ItemComponent类，请您再次检查我的问题并指出我的错误，谢谢：）我看到的一个问题是您没有等待

http.get（）

在从复制之前成功（

this.dataItem=this.\u sharedData.dataItem；

）。当第一次加载应用程序或组件时，这应该已经导致问题，而不仅仅是在第二次路由回应用程序或组件时。如果要同步数据，复制数据是危险的。显示了每个对数据感兴趣的组件从可观察到的自身获取数据的方式。您在questino中的代码包含了许多与问题无关的代码，这使得阅读起来很麻烦。我再次编辑了我的问题，并尝试删除所有不相关的代码，谢谢：）我会将

jstreeseservice

注入

SharedData

并生成

SharedData

以获取数据本身，而不是使用

AppComponent

从

jstreeseservice

复制到

SharedData

SharedData

应使用

Observable

（

BehaviorSubject

），感兴趣的组件应订阅此Observable以获得更新通知。这样可以确保组件在数据到达或更改时得到更新。

<div class="">
  <label *ngFor="let item of dataItem"> <input type="checkbox" name="checkbox" value="value"> {{item.text}} <br></label>
</div>

@Component({
  selector: 'Item',
  template: require('./item.html'),
  providers: [
    // JSTreeService,

  ]
})
export class ItemComponent implements CanReuse, OnReuse {
  dataItem: IDataItem[];
  flag: number;

  constructor(private _sharedData: SharedData) {
    // this.dataItem = params.get('dataitems');


  }

  ngOnInit() {
    // console.log(this.dataItem);
    this.dataItem = this._sharedData.dataItem;

  }
  routerCanReuse(next: ComponentInstruction, prev: ComponentInstruction) {


    return true;
  }
  routerOnReuse(next: ComponentInstruction, prev: ComponentInstruction) {
    //  this.name = next.params['name'];
    this.dataItem = this._sharedData.dataItem;
    console.log(this.dataItem);
  }
  ngOnDestroy() {
    // this.dataItem = this._sharedData.dataItem;
  }
}

routerCanReuse(nextInstruction: ComponentInstruction, prevInstruction: ComponentInstruction) : boolean |
<boolean> {
  return true; 
}