2016-02-22 5 views
2

Я работаю над угловым применением 2, я использую ng2-select для всплывающего меню. Он работает отлично, создавая новую запись. Но при попытке реализовать то же самое, в то время как редактирование Я не могу установить выбранные по умолчанию значения значения вытащил базу данных.Как установить выбранное значение ng2-select

<ng-select [initData]="aminities" (data)="refreshValue($event)" [multiple]="true" [items]="items" [disabled]="disabled"></ng-select> 


export class EditProjectComponent { 
    project: ProjectModel; 
    routeParam: RouteParams; 
    aminities: any; 
    private items: Array<string> = ['Swimming Pool', 'Gymnasium', 'Lift', 'Power Backup', 
     'Landscaped Garden', 'Security', 'Community Hall', 'Jogging Track', 'Childrens Play Area']; 
    constructor(
     @Inject(Router) private router: Router, 
     @Inject(ProjectService) private projectService: ProjectService, 
     routeParam: RouteParams, 
     private _formBuilder: FormBuilder 
    ) { 

     this.project = new ProjectModel(); 
     this.routeParam = routeParam; 
     if (this.routeParam.params['id'] != undefined) { 
      this.projectService.getbyId(this.routeParam.params['id'], (res) => { 
       this.project = res; 
       this.aminities = this.project.overview.aminities; 

      },() => { }); 
     } 
    } 

    } 

После ответа пришел я должны установить aminities значения в NG2-выберите.

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

+1

Не можете ли вы снова создать новый выбор с выбранным значением и снова инициализировать ng2? –

+0

Я не совсем понял ваш вопрос. Вы пытаетесь изменить элементы в своем выборе? Или вы пытаетесь так выбрать значение? –

ответ

4

Если вы хотите выбрать все aminities после того, как они вернутся из ответа, вы можете вызвать его, нажав их на active.

Это единственный способ, которым я нашел это. Конечно, лучший вариант.

Сначала мы добавляем в качестве вида детей.

import {Select} from 'your-location'; 

export class EditProjectComponent { 
    //... 

    @ViewChild(Select) 
    private select: Select; 

    //... 
} 

(Если у вас есть более 1 затем использовать @viewChildren и QueryList<>)

После этого мы сначала находим параметры, которые выбраны из itemObjects.

let arr = []; 
arr = this.select.itemObjects.filter((x) => { 
    let isAminities = this.aminities.find((y) => y.text === x.text); 
    return (isAminities !== -1) ? true: false; 
}) 

Теперь, когда мы имеем arr со всеми деталями, то мы должны, мы просто нажать его выбора активного списка.

this.select.active.push(arr) 

Конечный результат:

export class EditProjectComponent { 
    project: ProjectModel; 
    routeParam: RouteParams; 
    aminities: any; 

    @ViewChild(Select) 
    private select: Select; 

    private items: Array<string> = ['Swimming Pool', 'Gymnasium', 'Lift', 'Power Backup', 
     'Landscaped Garden', 'Security', 'Community Hall', 'Jogging Track', 'Childrens Play Area']; 
    constructor(
     @Inject(Router) private router: Router, 
     @Inject(ProjectService) private projectService: ProjectService, 
     routeParam: RouteParams, 
     private _formBuilder: FormBuilder 
    ) { 

     this.project = new ProjectModel(); 
     this.routeParam = routeParam; 
     if (this.routeParam.params['id'] != undefined) { 
      this.projectService.getbyId(this.routeParam.params['id'], (res) => { 
       this.project = res; 
       this.aminities = this.project.overview.aminities; 
       let arr = []; 
       arr = this.select.itemObjects.filter((x) => { 
        let isAminities = this.aminities.find((y) => y === x.text); 
        return (isAminities !== -1) ? true: false; 
       }) 
       this.select.active.push(arr) 

      },() => { }); 
     } 
    } 

    } 

Я знаю, что будут и другие варианты, чтобы сделать это. Но пока это единственное, с чем я мог работать.

+0

this.project.overview.aminities это просто массив строки – Rhushikesh

+1

, а затем найдите только что: 'y === x.text' –

+1

@JoelAlmeida объяснит, что ваше местоположение в импорте {SELECT} из 'your- место нахождения';? Я попытался импортировать {SELECT} из 'ng2-select/ng2-select', где я получаю свои SELECT_DIRECTIVES, но получаю ошибку. –

Смежные вопросы