Я работаю с 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;
}
}