Как просмотреть выбранные элементы в полном списке компонентов ion-select? - PullRequest
0 голосов
/ 27 марта 2019

У меня есть список карточек и я получаю json с сервера в такой структуре:

object1 : {
  prop1 : ''
  listOfObjects : []
}

, так что object1 имеет много-много отношений с объектом в listOfObjects. И я получаю только объекты, которые связаны с отношениями с моим основным объектом зрения.

Для просмотра связанных объектов я использую ion-select компонент из ionic 4. И мне нужно отметить только выбранный связанный объект из всех объектов. например,

Full list of objects
obj1
obj2
obj3
obj4

Объекты, которые связаны с основной моделью

  • obj1
  • obj2

А в ion-select это будет так

  • obj1 [выбрано]
  • obj2 [выбрано]
  • obj3
  • obj4

Как я могу получить это ???

projectService.projectsList >> получить весь проект с сервера sprintService.selectedSprint.projects >> связанные проекты со спринтом

Пожалуйста, дайте мне любую альтернативу для этой проблемы, если это невозможно с ion-select ... Спасибо всем.

<ion-select #projects ngModel name="projects" [(ngModel)]="sprintService.selectedSprint.projects"
                    multiple="true">
                    <ion-select-option *ngFor="let project of projectService.projectsList" [value]="project">
                      {{project.name}}
                    </ion-select-option>
                  </ion-select> 

my model
export class Sprint{
    id : number;
    name : string;
    description : string;
    startDate : string;
    endDate : string;
    priority : number;
    projects : Project[]
}

export class Project{
    id : number;
    name : string;
    description : string;
    startDate : string;
    endDate : string;
}

1 Ответ

0 голосов
/ 28 марта 2019

Попробуйте добавить функцию сравнения, и таким образом убедитесь, что проекты выбраны. Как то так.

<ion-select [(ngModel)]="projects" multiple="true" [compareWith]="compareObject">
   <ion-select-option *ngFor="let p of sprintService.selectedSprint.projects" [value]="p">{{p.name}}</ion-select-option>
</ion-select>

compareObject(a: any, b: any) {
   return a.id === b.id;
}
...