好吧,也许我的问题听起来类似于关于Angular2-EventEmitter-Subject-Observable-Subscribe-stuff的几个问题......但是它完全不同。
我的目标(简而言之):
能够从路径 ItemsList 转到路由 AddNewItem ,然后按下自定义的“后退”按钮,找到自己在 ItemsList WITH我在这里的所有设置。例如 - 搜索参数。所以... Angular2 +中唯一的方法(afaik)在非相关组件之间存储该参数是使用共享服务。所以...我的代码:
ItemsList ts \ html (非常简短):
export class ListComponent implements OnInit {
public addItem(allSettings: ISettingsTable) {
this._shService.returnToList = true;
this._shService.allCurrentSettings = allSettings;
this._router.navigate(['someRoute', 'add']);
}
ngOnInit() {
this._settings = {
search: /* .. */,
/* .. */
}
this._shService.getSettings().subscribe((settings: ISettingsTable) => {
this._settings = settings;
}
}
}
<button (click)='addItem(_settings)'>
<mat-icon svgIcon='add'></mat-icon>
</button>
服务(简而言之):
export class SettingsService {
private _returnToList: boolean;
private _settingsChanged$: Subject<ISettingsTable> = new Subject();
public emitSettings(val: ISettingsTable) {
this._settingsChanged$.next(val);
}
public getSettings(): Subject<ISettingsTable> {
return this._settingsChanged$;
}
}
AddEditItems ts \ html (非常简短):
export class EditComponent implements OnInit {
public back(par: ISettingsTable): void {
if (this.returnToList) {
this._router.navigate(['someRoute', 'list']).then(() => {
this._shService.emitSettings(par);
});
ngOnInit() {
if (this._shService.returnToList) {
this.returnToList = true;
this._p = this._testS.allCurrentSettings;
}
}
}
<button mat-raised-button (click)='back(_p)'>Go back</button>
所以!当我转到添加路线时,我将当前的参数存储在服务中。精细。然后在添加路线上,我从服务中获取它们。精细。然后,当我想回去的时候,我把那个参数传递给了主题\事件发射器的发射方法......好吧!但是在列表路由this._settings
上只存在INSIDE订阅...它在外部未定义。是的,我知道异步行为和东西...但如何正确解决我的问题???任何人!请。希望我能说清楚。
修改...
显然我总是在所有路线上都有一些设置。问题是我不知道如何编码如果我有一些来自observable的设置 - 使用它们,如果没有 - 使用默认this._settings ......