Angular 2 изменить заголовок страницы через сервис

Question

У меня есть компонент страницы, который загружает контент через сервис. Название страницы в настоящее время установлено в ngOnInit, но я хотел бы изменить его, чтобы задать заголовок страницы с данными, полученными через сервис. JSON, полученный службой, имеет поле "title" со строкой для заголовка страницы.

Прямо сейчас код выглядит так:

import { Component, OnInit } from '@angular/core';
import { Title } from '@angular/platform-browser';
import { GetPageService } from '../shared/get-page/get-page.service';

@Component({
    selector: 'app-capabilities',
    templateUrl: './capabilities.component.html',
    styleUrls: ['./capabilities.component.scss']
})
export class CapabilitiesComponent implements OnInit {

    data: any[] = [];
    errorMessage: string;

    constructor(
        private titleService: Title,
        public getPageService: GetPageService
    ) { }

    ngOnInit() {
        this.getPage();
        // line below should be replaced so that title come from getPage data
        this.titleService.setTitle('Sample Page Title');
    }

    getPage() {
        this.getPageService.getPage('capabilities')
            .subscribe(
                data => this.data = data,
                error => this.errorMessage = <any>error
            );

    }

}

Я попытался прикрепить функцию для подписки, но пока что получаю только ошибки. Любые намеки, указывающие мне в правильном направлении, будут очень благодарны.

Answer 1

Установите заголовок из subscribe():

getPage() {
    this.getPageService.getPage('capabilities')
        .subscribe(
            (data: any) => {
              this.data = data;
              // Set the title here.
              this.titleService.setTitle(data.title);  // Or data['title']
            },
            error => console.error(error)
        );

}