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'];
        }
    );
  }

}

Спасибо

0 ответов

Другие вопросы по тегам