Данные, перенесенные из наблюдаемой не отображаются в интерполяции - PullRequest
Новая
       6

Данные, перенесенные из наблюдаемой не отображаются в интерполяции

0 голосов
/ 24 сентября 2018

У меня есть следующий сервис: 

  private vulnerabilityDescriptionSource: BehaviorSubject<
    VulnerabilityDescription
  > = new BehaviorSubject(new VulnerabilityDescription());
  public vulnerabilityDescription: Observable<
    VulnerabilityDescription
  > = this.vulnerabilityDescriptionSource.asObservable();

  public getVulnerabilityDescriptions(vulerabilityId: string) {
    return this.http
      .get<VulnerabilityDescriptionResponse>(
        Endpoints.getvulnerabilityDescriptions(vulerabilityId)
      )
      .subscribe(
        (vulnerabilityDescriptionResponse: VulnerabilityDescriptionResponse) =>
          vulnerabilityDescriptionResponse.data.vulnerabilityDescription
      );
  }

Я звоню в сервис так: 

  public vulnerabilityDescription: Observable<VulnerabilityDescription> = this
    .vulnerabilityService.vulnerabilityDescription;  

  ngOnInit() {
    this.vulnerabilityService.getVulnerabilityDescriptions(this.vulnerability.type);

  }

Когда я открываю страницуЯ вижу правильные данные, передаваемые во вкладке сети.Моя проблема в том, что, когда я хочу получить доступ к данным через интерполяцию в моем html-файле, ничего не появляется, нет ошибок или чего-либо еще.

Вот как я пытаюсь отобразить данные: 

      <div *ngIf="vulnerabilityDescription | async as vulnerabilityDescription">
        {{vulnerabilityDescription.shortdescription}}
      </div>              
      <div class="tab-pane fade show active"  [attr.id]="'v'+vulnerability.id+'description'" role="tabpanel" aria-labelledby="v-pills-home-tab">
          {{(vulnerabilityDescription | async )?.shortdescription}}

Что мне не хватает?

Спасибо за любую помощь.

1 Ответ

0 голосов
/ 24 сентября 2018

Вы должны поместить .subscribe в свой component.ts, потому что у вас есть доступ к данным только внутри 

.subscribe((result:VulnerabilityDescriptionResponse) =>{
//what i want to do whit the result from the call
this.vulnerabilityDescription = result;
}

Таким образом, чтобы решить вашу проблему, ваша служба должна стать 

 private vulnerabilityDescriptionSource: BehaviorSubject<
    VulnerabilityDescription
  > = new BehaviorSubject(new VulnerabilityDescription());
  public vulnerabilityDescription: Observable<
    VulnerabilityDescription
  > = this.vulnerabilityDescriptionSource.asObservable();

  public getVulnerabilityDescriptions(vulerabilityId: string) {
    return this.http
      .get<VulnerabilityDescriptionResponse>(
        Endpoints.getvulnerabilityDescriptions(vulerabilityId)
      );
  }

В вашем component.ts 

import { yourServiceClassName} from "where is the service";

export class Component implements OnInit {

    //inject your service
    constructor(private yourService:yourServiceClassName) { }

    ngOnInit() {
    this.yourService.subscribe(result =>{
    this.vulnerabilityDescription = result;
    }

}

В вашем шаблоне component.html

Удалите | async из него

И оно должно работать

...