Question

我有以下代码，当我点击oost（：slug）时，它会显示wright内容但是当我点击zuid（：slug）时，没有新内容。我怎样才能做到这一点？

路线：

{ path : ':slug' , name: 'Items' , component: DirectoryComponent},

DirectoryComponent：

ngOnInit() {
    this.slug = this.activatedRoute.snapshot.params['slug'];
    this.dataService.fetchData(this.slug)
        .subscribe(
            (data) => {
         .......
    }
}

的DataService：

fetchData(slug) {
    if (slug == '') {
        slug = 'home';
    }
    return this.http.get(ConfigService.API_URL + 'items/' + slug)
        .map(
            (res) => res.json()
        )
        ;
}

答案：

构造函数（public activatedRoute：ActivatedRoute， private dataService：DataService， private seoService：SeoService，私有路由器：路由器）{

this.activatedRoute.params.subscribe(
    params => {
        this.dataService.fetchData(params['slug'])
            .subscribe(
                (data) => {
                 .....

Answer 1

如果我理解正确，你会停留在同一条路线上，但参数不同。在这种情况下，Angular不会重新创建新组件，而是保持相同的组件。因此，您不应该使用快照，而是订阅激活路径的params observable，并在发出新参数时刷新数据。

Answer 2

这有效：

constructor( public activatedRoute:ActivatedRoute, 
             private dataService:DataService, 
             private seoService:SeoService, 
             private router:Router ) {

    this.activatedRoute.params.subscribe(
        params => {
            this.dataService.fetchData(params['slug'])
                .subscribe(
                    (data) => {
                     .....

Typescript Angular 2 onchange url不改变内容

2 个答案: