Question

你好

我有一个angular2应用程序，显示来自api的帖子。

当用户导航到路线时，我在浏览器中使用类别名称，如下所示：

www.example.com/sport。

但我的服务器只接受id而不是名字。

所以我的问题是：如何将id发送到服务器，但在用户导航到页面时在url中显示名称。

下面是我的代码：

这是我的类别列表组件：

这些是我对类别的链接，我传递了类别的名称，并为其前缀添加了一些文本。

<section class="categories_div no-padding">

<div class="col-md-12  col-xs-12 text-center">

    <ul class="list-group ul_categories text-center">
        <li *ngFor="let cat of categories" class="text-center"><a class="categories_list_link"  routerLink="/{{prependUrl+cat.name}}" routerLinkActive="active" [routerLinkActiveOptions]="{exact: true}" >{{cat.name}}</a> </li>
    </ul>
</div>

</section>

这是我的类别项目组件

我在这里获取名称并删除该前置，然后我使用服务来获取此类别的帖子。

ngOnInit() {
    let name = this.route.snapshot.params['category'];
    name = name.replace('posts-', '');
    this.getCategoryNews(name);

}

getCategoryNews(category:string):any {
    this.categoryService.getCategoryNews(category).subscribe(result => {

                this.allNews = result.data
        },
        err => {
            alert('we have error in connection');
        }
    );
}

，这是我的categoryService

import {Injectable} from "@angular/core";
import {Headers, Http, Response} from "@angular/http";
import "rxjs/Rx";
import {Observable} from "rxjs/Rx";

@Injectable()
export class CategoryService {

private CategoryUrl = 'http://test.com/v1/category';
private headers = new Headers({'Content-Type': 'text/plain',});


constructor(private http:Http) {
}

getCategories():Observable<any> {
    return this.http.get(this.CategoryUrl)
        .map((response:Response) => response.json());
}

getCategoryNews(id:number):Observable<any> {
    const url = `${this.CategoryUrl}/${id}`;
    return this.http.get(url)
        .map((response:Response) => response.json());
}

不知怎的，我只需要将类别ID传递给我的服务，但在url中显示其名称。

Angular2在路由中使用对象名称，但在http中发送id

0 个答案: