Как установить множественный выбор в выпадающем списке в ng2-smart-table?
В моем приложении я загружаю динамические значения в выпадающий список ng2-smart-table. Теперь я должен включить множественный выбор в выпадающем списке в ng2-smart-table.
Примечание: множественный выбор в раскрывающемся списке не для флажка.
1 ответ
Решение
Я думаю, что вы можете попробовать с вашим собственным компонентом редактора. Я добавил базовый select
с кратным attribute
, но вы можете создать пользовательский компонент более сложным, как вы предпочитаете.
Передайте данные в ваш компонент с valuePrepareFunction
и вуаля.
settings.ts
private settings = {
// Previous config ...
columns: {
multiple: {
title: 'Multi select',
type: 'html',
editor: {
type: 'custom',
valuePrepareFunction: (cell, row) => row,
component: MultiSelComponent,
},
}
}
}
multiSel.component.html
<select multiple [(ngModel)]="yourModelStore">
<option *ngFor="let item of myValues" [value]="item.value">{{item.name}}</option>
</select>
multiSel.component.ts
import { Component, Input, OnInit } from '@angular/core';
import { ViewCell } from 'ng2-smart-table';
....
export class MultiSelComponent implements OnInit {
@Input() value;
yourModelStore: any; // rendered as this.yourModelStore = ['value', 'value'];
ngOnInit() {
this.myValues = this.value;
}
module.ts
declarations:[
//others ...
MultiSelComponent
]
entryComponents: [
MultiSelComponent
]
** Я отредактировал ответ и добавил больше информации о настройках и component.ts
yourField: {
title: 'Your field title',
editor: {
type: 'list',
config: {
selectText: 'Select',
list: [
{ value: '1', title: 'Admin' },
{ value: '2', title: 'Manager' },
],
},
},
type: 'number',
},