0

我需要将电流传递userId给routerlinkinborrow_list component

我声明的userId方式borrow_list component

userId: number;
constructor(private authService: AuthService, private bookService: BookService,
     private route: ActivatedRoute, private alertify: AlertifyService) { }



ngOnInit() {
    this.userId = this.authService.decodedToken.nameid;
    this.route.data.subscribe(data => {
      this.books = data['books'].result;
      this.pagination = data['books'].pagination;
    });
    this.borrowParam = 'loan';
    console.log(this.userId); // this one return 26
  }

然后我尝试使用传递userId给另一个组件routerlink

<div class="row">
  <div *ngFor="let b of books" class="col-sm-6 col-md-4 col-lg-4 col-xl-2">
    <app-book-card [book]="b"></app-book-card>
    <button class="btn btn-primary" [routerLink]=" 
     ['/browse/book/',this.userId,'/content/', b.id]" style="width: 75px">Read 
    </button>
  </div>
</div>

但它似乎不起作用，没有错误，但它引导我回到主页

当我尝试对链接进行硬编码并且它按预期工作时，即

[routerLink]="['/browse/book/26/content/', b.id]"

我的routes.ts

{path: 'browse/book/:id/content/:bookId', component: Book_contentComponent, resolve: {book: BookContentResolver}}

我想我在某个地方做错了吗？

4

2 回答 2

2

请试试这个：

<button class="btn btn-primary" [routerLink]=" ['browse', 'book', userId, 'content', 
b.id]" style="width: 75px">Read </button>

每个路径段都是数组中的一个元素。

于 2019-04-29T12:02:17.670 回答
0

在模板中时，变量会自动从底层组件中获取。所以你不需要 putthis来访问成员变量。

在您的代码中，您只需要userId代替this.userId，给出：

<button class="btn btn-primary" [routerLink]=" 
 ['/browse/book/', userId,'/content/', b.id]" style="width: 75px">Read 
</button>

注意style：在 HTML中放入内联不是一个好习惯。

于 2019-04-29T12:01:29.600 回答