Как передать массив в параметр маршрутизации?

Question

* Я делаю угловой проект (версия 6+). Я хочу передать параметр массива, используя маршрутизацию. *

const routes: Routes = [

  {
    path: 'books',
    component: BookComponent
  }
  ,
  {
    path: 'books/:id',
    component: BookDetailComponent
  },

...

Answer 1

В html отправьте данные сюда сначала. Вы импортируете активированный маршрут, как показано ниже.import {ActivatedRoute} из '@ angular / router';

, а также в конструкционном строительстве (private _routes: ActivatedRoute) {}

In ====== ngOnInit (this._route.params.subscribe (params => {this.id = param ['id'];)

Answer 2

Есть два способа использования,

Метод 1:

HTML

<a routerLinkActive="active" [routerLink]="['/home', userIDs.join()]">Home</a>

TS:

userIDs: Array<number> = [1, 3, 4];

Машинопись для домашнего компонента:

export class HomeViewComponent implements OnInit {
  userIDs: Array<number> = [];

  constructor(private router: ActivatedRoute)   { }

  ngOnInit() {
    this.router.params.subscribe(params => {
      this.userIDs = params['ids'].split(',');
    });
  }    
}

Модуль маршрутизатора:

 path: 'home/:ids', component: HomeViewComponent }

Метод 2 (с использованием queryParams):

Вам не нужно ничего добавлять в модуль маршрутизатора, как мы делаем вышеописанным способом.

HTML

<a routerLinkActive="active" [routerLink]="['/home']" [queryParams]="{ids: userIDs}">Home</a> 

TS

userIDs: Array<number> = [1, 3, 4];

Машинопись для домашнего компонента:

export class HomeViewComponent implements OnInit {
  userIDs: Array<number> = [];

  constructor(private router: ActivatedRoute)   { }

  ngOnInit() {
    this.router.queryParams.subscribe(p => {
        this.userIDs = p.ids;
    }); 
  }
}