Универсальные угловые данные дочерних маршрутов вне источника страницы - PullRequest
0 голосов
/ 24 сентября 2018

Я работаю с Angular Universal для SEO.Я признал, что данные некоторых дочерних компонентов (например, ShowExperienceComponent.ts) не отображаются в источнике страницы.Но данные из моего SearchComponent я это вижу.Что я делаю не так?

Мой маршрут выглядит так:

const routes: Routes = [
  { path: '', component: AppComponent,
    children:
    [
      { path: '', redirectTo: '/', pathMatch: 'full' },
      { path: '', component: SearchComponent }, // Here I can see the data in the browser
      { path: 'id/:id/:id', component: ShowExperienceComponent }, // Here I CAN'T see the data in the browser
    ]
  }]

ShowExperienceComponent.ts

import { Http, Response } from '@angular/http';
import { ActivatedRoute, Route } from '@angular/router';
import { PLATFORM_ID, Inject, Component, OnInit, EventEmitter, ElementRef, Output } from '@angular/core';
import url from '../../conf/conf';
import { Observable } from 'rxjs';
import { isPlatformBrowser, isPlatformServer } from '@angular/common';
import { Meta, Title } from '@angular/platform-browser';
import { map } from 'rxjs/operators';
import { HttpClient } from '@angular/common/http';

@Component({
  selector: 'app-show-experience',
  templateUrl: './showexperience.component.html',
  styleUrls: ['./showexperience.component.css']
})
export class ShowExperienceComponent implements OnInit {
  data: any = [];
  isAlive = false;

  constructor(private meta: Meta, private title: Title, private http: HttpClient) {


  }

  ngOnInit() {
    let param = window.location.href.split('/')[4]
    this.getExData(param)
  }

  getExData(exId) {
    this.http.post(url + '/api/loadSpecData', { id: exId }).pipe(
      map(res => res))
      .subscribe(
        (res: any) => {
          this.data = res;
          this.title.setTitle(this.data[0]['title'] + ' - ' + this.data[0]['city']);
          this.meta.addTags([
            { name: 'keywords', content: 'Globetrotter, Backpacking, Hiking, Travel' + this.data[0].city + ',' + this.data[0].country },
            { name: 'description', content: this.data[0].description },
            { property: 'og:image', content: this.data[0].images[0] }

          ]);
        }
      )

  }

  loginState(alive) {
    this.isAlive = alive;
  }
}
...