Question

简介

我有一个搜索框让你选择一个电视节目，然后记录你点击的节目的标题，以及该节目的ID。我在我的：

中定义了这个

landingpage.component

<li (click)="selectShow(list.title)" [routerLink]="['/details', list.id]" 
*ngFor="let list of shows"> {{list.show}} </li>

点击 li 后，它会将list.id作为参数发送到我的 / details 组件。 selectShow只记录点击的节目的名称（list.title）。

我的问题：

我似乎无法弄明白如何resolve我的list.title值，以便它显示在this.route.snapshot.data['title']

中的 / details 路线中

我的代码：

app.routing.module.ts

import { NgModule } from '@angular/core';
import { RouterModule, Routes } from '@angular/router';
import { TitleResolver } from './services/title.service';

const routes: Routes = [
  { path: '', component: LandingPage },
  {
    path: 'details/:id', component: ResultPage,
    resolve: {
      title: TitleResolver //hopefully contains 'title' data here?
    }
   }
  }
];

resultpage.component.ts

  title; //variable we will assign to title

  constructor(private route: ActivatedRoute) {}

  this.route.data
    .subscribe((data: { title: Title}) => {
      console.log(title);
    });

title.service.ts

// this gives us the name of the clicked show
class ShowService {
  fetchTitle(title) {
    return title;
  }
}

@Injectable()
export class TitleResolver {
  constructor(private showservice: ShowService) { }

  resolve(
    route: ActivatedRouteSnapshot,
    state: RouterStateSnapshot
  ): Observable<any> | Promise<any> | any {
    return this.showservice.fetchTitle(route.params.title);
  }
}

我的问题

为了将 landingpage.component 数据中的选定list.title值发送到 app.routing，我需要执行哪些中间步骤。 module.ts ，以便我可以在 resultpage.component 中收到它？

以角度2解析数据

0 个答案: