Как загрузить правильный элемент с помощью routerlink? - PullRequest
0 голосов
/ 09 апреля 2020

У меня есть приложение angular 8. И у меня есть две вкладки. И у меня есть функция, где вы можете создать новый элемент. Но переключение между созданием разных предметов не будет обновлено. Но URL обновляется.

Так, например, вы хотите создать itemTypes.Note. Но затем вы переключаетесь на: itemTypes.Goal. Но это не обновляет интерфейс. ссылка будет обновлена.

Таким образом, эта ссылка:

http://localhost:4200/en/dossier/06637e72-8915-4735-9400-4ef7705194ea/item/new/Note

будет обновлена ​​до:

http://localhost:4200/en/dossier/06637e72-8915-4735-9400-4ef7705194ea/item/new/Goal

Но пользовательский интерфейс не обновляется.

Итак, у меня есть это:

  <mat-tab>
        <ng-template mat-tab-label>
          <mat-icon class="notes">note</mat-icon>
          <span i18n>Notes</span>{{ dossierItemsCountString(itemTypes.Note) }}
          <a [routerLink]="['../', dossier.id, 'item', 'new', itemTypes.Note]"
            ><mat-icon class="add_box">add</mat-icon>
          </a>
        </ng-template>
        <ng-container *ngTemplateOutlet="itemList; context: { itemType: itemTypes.Note }"></ng-container>
      </mat-tab>
      <mat-tab>
        <ng-template mat-tab-label>
          <mat-icon class="goals">grade</mat-icon>
          <span i18n>Goals</span>{{ dossierItemsCountString(itemTypes.Goal) }}
          <a [routerLink]="['../', dossier.id, 'item', 'new', itemTypes.Goal]"
            ><mat-icon class="add_box">add</mat-icon>
          </a>
        </ng-template>
        <ng-container *ngTemplateOutlet="itemList; context: { itemType: itemTypes.Goal }"></ng-container>
      </mat-tab>
      <mat-tab>

И сценарий ts такой:

export class ViewComponent implements OnInit {
  dossier: DossierDto;
  dossierItems: DossierItemDto[] = [];
  itemSearchMatches = {};
  typeSearchMatches = {};
  formBuilder = new FormBuilder();
  editDossierForm: FormGroup;
  globalEditDossierErrors: ValidationErrors;
  itemTypes = DossierItemTypeDto;
  searchQueryHolder = '';
  //@ViewChild('tabGroup') tabGroup;
  selectedTabIndex: number;
  selectedTab = 0;
  showTemplate = false;

  constructor(
    private uiStateService: UIStateService,
   private route: ActivatedRoute,

  ) {
    this.dossier = route.snapshot.data.dossier;
    this.dossierItems = route.snapshot.data.dossierItems;
    this.searchDossieritems(null);
    this.editDossierForm = this.formBuilder.group({
      name: this.formBuilder.control(this.dossier.name, [Validators.required])
    });
    this.editDossierForm.disable();
  }


  ngOnInit(): void {   

    this.route.params.subscribe((params: Params) => {
     // this.itemTypes.ActionStep = params['itemTypes.ActionStep'];

    });


  }
}

Так что я должен изменить? Спасибо

...