Angular - карта всегда возвращает неопределенное

1

У меня есть угловая страница, которая имеет список свойств. В каждом объекте есть ссылка, чтобы просмотреть детали объекта. У меня есть функция, которая отображает свойство по id, однако в качестве возврата я всегда получаю неопределенный (напечатан на консоли).

service.ts

 getProperties(): Observable<IProperty[]>{
     return this.http.get<IProperty>('http://localhost:3000/')
     .do(data => this.properties.push(JSON.stringify(data)))
     .catch(this.handleError);  
 }

 getProperty(id:number): Observable<IProperty>{
    return this.getProperties()
    .map((properties: IProperty[])=> properties.find(p=>p.propertyId===id));
}

propertyDetail.component.ts

import { Component, OnInit } from '@angular/core';
import { IProperty } from './property';
import { ActivatedRoute, Router } from '@angular/router';
import { ApiService} from '../api/api.service';
import { PropertyGuardService } from './property-guard.service' 


@Component
({
  selector: 'propertyDetail',
  templateUrl: './propertyDetail.component.html',
  providers: [PropertyGuardService]
})

export class PropertyDetailComponent implements OnInit
{

    pageTitle:string = "Property Details";
    property: IProperty;
    errorMessage: string ="";

    constructor(private _route : ActivatedRoute,
                private _router: Router,
                private apiService: ApiService){
       console.log(this._route.snapshot.paramMap.get('id'));
    }

    ngOnInit(){
        const param = this._route.snapshot.paramMap.get('id');
        if(param){
            const id = +param;
            this.getProperty(id);

            console.log(this.getProperty(id));
        }            
    }

    getProperty(id:number)
    {
            this.apiService.getProperty(id).subscribe(
            property => this.property = property,
            error => this.errorMessage = <any>error);
    }

    onBack(): void
    {
        this._router.navigate(['/properties']);
    }
}  
  • 0
    Как выглядит getProperties ?
  • 0
    @echonax добавил код, в основном он вызывает сервер для получения всех данных в коллекции мангустов
Показать ещё 4 комментария
Теги:
angular

1 ответ

1
Лучший ответ

Вы устанавливаете одно свойство с помощью property => this.property = property, подписываясь в подходящее время, и теперь вы можете использовать this.property в представлении, например {{property?.id}}.

Если вы хотите проверить Property, правильно ли оно выбрано или нет, вы можете использовать следующее:

getProperty(id:number){
   this.apiService.getProperty(id).subscribe(
      property => {
        this.property = property,
        console.log(property) // check property returned here           
      });
}

Ещё вопросы

Сообщество Overcoder
Наверх
Меню