Angular 4 Resolve Route - ошибка ERROR: Uncaught (в обещании): TypeError: Невозможно прочитать свойство 'map' из неопределенного
Angular Gurus, я новичок в Angular. Ваша помощь будет принята с благодарностью.
1) Подход работает нормально:
app.routing.ts
const appRoutes: Routes = [
{ path: 'clone', component: CloneComponent,
children: [
{path: 'status', component: StatusComponent, resolve: {config: ConfigResolver} },
]
},
]
config.service.ts
@Injectable()
export class ConfigService {
private configsArray = new BehaviorSubject<Config>(undefined);
configsArray$ = this.configsArray.asObservable().first();
updateConfigs(configs: Config) {
this.configsArray.next(configs)
}
getConfigs() {
let headers = new Headers();
headers.append('Content-Type','application/json');
this.updateFetchConfigs('Fetching');
return this.http.get('http://localhost:8080/sample1/api/config', { headers: headers }).map((response: Response) => response.json());
}
}
Конфигурационные-resolver.service.ts
@Injectable()
export class ConfigResolver implements Resolve<Config> {
config: Config;
constructor(private configService: ConfigService, private router:Router) {}
resolve(route: ActivatedRouteSnapshot, state: RouterStateSnapshot): Observable<Config> | Promise<Config> | Config {
return this.configService.configsArray$.map( // this is working
data => {
return data;
}
);
}
}
app.component.ts
export class AppComponent implements OnInit, OnDestroy {
constructor(private route: ActivatedRoute,
private router:Router,
private configService:ConfigService ) {
}
ngOnInit() {
this.configsSubscription = this.configService.getConfigs().subscribe(configs => {
this.configs = configs;
this.configService.updateConfigs(configs);
}
}
}
2) Ошибка ниже, при выполнении this.configService.getConfigs(). Map из config-resolver.service.ts
ошибка
ОШИБКА Ошибка: Uncaught (в обещании): TypeError: Невозможно прочитать свойство 'map' из неопределенного
config.service.ts
@Injectable()
export class ConfigService {
private configsArray = new BehaviorSubject<Config>(undefined);
configsArray$ = this.configsArray.asObservable().first();
updateConfigs(configs: Config) {
this.configsArray.next(configs)
}
getConfigs() {
let initialLoad: number = 0;
let initialLoadDone: boolean = false;
if (this.fetchConfigs) == 'NotFetched') {
// if it meets this if condition it is working
let headers = new Headers();
headers.append('Content-Type','application/json');
this.updateFetchConfigs('Fetching');
return this.http.get('http://localhost:8080/sample1/api/config', { headers: headers }).map((response: Response) => response.json());
}
else {
// if it does not meet this if condition it is not working
Observable.interval(1)
.takeWhile(() => !initialLoadDone)
.subscribe(() => {
++initialLoad;
if (this.getConfigs1(this.fetchConfigs$) == 'Fetched' || initialLoad > 10000) {
initialLoadDone = true;
return this.configsArray$;
}
});
}
}
}
Конфигурационные-resolver.service.ts
@Injectable()
export class ConfigResolver implements Resolve<Config> {
config: Config;
constructor(private configService: ConfigService, private router:Router) {}
resolve(route: ActivatedRouteSnapshot, state: RouterStateSnapshot): Observable<Config> | Promise<Config> | Config {
return this.configService.getConfigs().map(
data => {
return data;
}
);
}
}
/ *
Uncaught (в обещании): TypeError: Невозможно прочитать карту свойств неопределенной ошибки - сверху верните команду this.configService.getConfigs(). Map
ошибка выше, если функция getConfigs () возвращает this.configsArray$(условие else из config.service.ts getConfigs() function),
это работает, если функция getConfigs () возвращает значение this.http.get (..). map (..) (т. е. если условие из функции config.service.ts getConfigs ())
* /
status.component.ts
export class StatusComponent implements OnInit, OnDestroy {
constructor(private configService:ConfigService,
private route: ActivatedRoute,
private router: Router) {}
ngOnInit() {
this.configSubscription = this.route.data.subscribe(
(data: Data) => {
this.test = data['config'];
}
);
}
}
Спасибо