Angular, получить родительский компонент маршрута - PullRequest
Новая
       25

Angular, получить родительский компонент маршрута

0 голосов
/ 02 февраля 2019

Я создаю приложение Angular 7.В этом приложении я получил вложенные маршруты.Я хочу быть в состоянии определить, какой компонент использует родительский маршрут.Я нашел способ сделать это локально, но это не работает на производстве (вывод отличается).

Я использую этот метод: 

   checkIfChild() {
    this.sub = this.route.parent.params.subscribe(params => {
      if (params['id']) {
        this.parentId = params['id'];
        if (this.route.parent.component['name'] === 'ProjectShowComponent') {
          this.parentType = 'Project';
        } else if (this.route.parent.component['name'] === 'CompanyShowComponent') {
          this.parentType = 'Company';
        } else if (this.route.parent.component['name'] === 'ContactShowComponent') {
          this.parentType = 'User';
        }
      }
    });
  }

Метод this.route.parent.компонент ['name'], выводит имя локально, но только букву T при производстве.

Вместо этого я получаю это сообщение 

TypeError: 'arguments', 'callee', and 'caller' cannot be accessed in this context.

Как правильно определить родительский маршрут?активировал дочерний маршрут, чтобы я мог действовать по нему?

1 Ответ

0 голосов
/ 02 февраля 2019

Лично я бы отбросил прямую связь с экземпляром компонента и вместо этого использовал бы свойство data маршрута, учитывая, что:

  • Вы никак не взаимодействуете с экземпляром компонента.
  • Вы сопоставляете тип экземпляра компонента со статическим значением.

При условии следующего определения маршрутов: 

const routes: Routes = [
  {
    path: 'production',
    component: ProductionParent,
    data: {parentRoute :'Production'},
    children: [{path: '', component: Child}] 
  },
  {
    path: 'system',
    component: SystemParent,
    data: {parentRoute :'System'},
    children: [{path: '', component: Child}] 
  }
];

@Component({})
export class ProductionParent{}

@Component({})
export class SystemParent{}

@Component({})
export class Child implements OnInit, OnDestroy {
  private parentSub = Subscription.EMPTY;
  parentRoute :string;


  constructor(private readonly route: ActivatedRoute){}

  ngOnInit(){
    this.trackParent();
  }

  ngOnDestroy(){
   this.parentSub.unsubscribe();
  }

  private trackParent(){
    this.parentSub = this.route.parent
                        .data
                        .subscribe(data => this.parentRoute = data.parentRoute || 'unknown');
  }
}

Скорее всего, это может быть реализовано другими способами., но это первый прагматический подход, который пришел мне в голову.Надеюсь, это поможет.

...