Angular 2 共享服务将数据传递到组件

我正在尝试传递字符串值this.title从我的登陆页面.组件到我的结果页面.组件。

我检索到list.show值，并将其发送到我的TitleService就像我的：

登陆页面.component.html

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

登陆页面.component.ts

import { TitleService } from '../../services/title.service';

constructor(private TitleService: TitleService) {}

selectShow(show) {
  this.TitleService.fetchTitle(show)
}

以上发送的是list.show对我的价值：

标题.service.ts

// this gives us the name of the clicked show, which we send to TitleResolver
@Injectable()
export class TitleService {
  fetchTitle(title) {
    console.log("title is " + title); // this outputs correctly
    return title;
  }
}

这是我管理路由的方法：

应用程序路由.module.ts

import { TitleService } from './services/title.service';

const routes: Routes = [
  { path: '', component: LandingPage },
  {
    path: 'details/:id', component: ResultPage
  }
];

@NgModule({
  imports: [RouterModule.forRoot(routes)],
  exports: [RouterModule],
  providers: [TitleService]
})

我的问题

一旦我收到title.show我的服务组件中的值，我不确定如何将其发送到我的接收组件（结果页.组件)

我怎样才能发送我的title我的服务对 ResultPage.component 的价值？

使标题成为服务的公共财产，如下所示：

// this gives us the name of the clicked show, which we send to TitleResolver
@Injectable()
export class TitleService {
  selectedTitle: string;

  fetchTitle(title) {
    console.log("title is " + title); // this outputs correctly
    this.selectedTitle = title;
    return title;   // No need to return it.
  }
}

然后任何其他组件都可以注入该服务并访问this.titleService.selectedTitle