ng2-select icon indicating copy to clipboard operation
ng2-select copied to clipboard

Add possibility to assign object to active property instead of array.

Open sharok opened this issue 8 years ago • 4 comments

In the source code we have the following code:

@Input()
  public set active(selectedItems:Array<any>) {
    if (!selectedItems || selectedItems.length === 0) {
      this._active = [];
    } else {
      let areItemsStrings = typeof selectedItems[0] === 'string';

      this._active = selectedItems.map((item:any) => {
        let data = areItemsStrings
          ? item
          : {id: item[this.idField], text: item[this.textField]};

        return new SelectItem(data);
      });
    }
  }

The selectedItems.map statement doesn't allow to assign simple object. The ng2-select supports single and multiple selection, so I think it's better to check what is passed to active and do appropriate actions. If simple object then just return it, if array then the current code.

My use case. I have a lot of selects on a page. There is a table and inside of cells user can create up to 2 selects. So, I use:

//...
 <ng-select *ngFor="let member of date.members; let i = index;"
                                               [items]="allMembers"
                                               [active]=date.member[i]
                                               (data)="updateSelectedMember($event,....)"
                                               placeholder="Select member">
                                    </ng-select>

And, I want to bind specific object to active.

sharok avatar Dec 12 '16 04:12 sharok

This actually is documented as a feature for ng2-select and was super surprised to see it not work as it specified.

http://valor-software.com/ng2-select/

active (?Array) - Initial selection data to set. This should be an object with id and text properties in the case of input type 'Single', or an array of such objects otherwise. This option is mutually exclusive with value.

I can implement this functionality if the team is willing to take a PR for the issue. Otherwise, I can help clean up the documentation to properly reflect what the possible values are.

Pokom avatar Jan 04 '17 19:01 Pokom

i have this array, but the default value setted by ngModel = 'RJ' throw this error below:

[ERROR] error_handler.js:54 EXCEPTION: Uncaught (in promise): Error: Error in ./UserProfileComponent class UserProfileComponent - inline template:123:21 caused by: selectedItems.map is not a function

[HTML] <ng-select [allowClear]="true" [items]="ufs" [(ngModel)]="profile.address.state" name="state" placeholder="uf">

[attempts] I tried all of this options, and none of those worked!

  1. [active]="ufs[18]"
  2. [active]="ufs"
  3. [active]="'RJ'"

[My simple Array] getDataStr():Array { return [ 'AC', 'AL', 'AM', 'AP', 'BA', 'CE', 'DF', 'ES', 'GO', 'MA', 'MG', 'MS', 'MT', 'PA', 'PB', 'PE', 'PI', 'PR', 'RJ', 'RN', 'RO', 'RR', 'RS', 'SC', 'SE', 'SP', 'TO']; }

fopnet avatar Mar 10 '17 19:03 fopnet

this code works for me

`<ng-select [allowClear]="allowClear" [items]="items" [active]="active" .....

public items: Array<string> = ['Amsterdam', 'Antwerp', 'Athens', 'Barcelona']; active:Array<string> = [this.items[3]];`

// prints Barcelona`

RomanNagornyi avatar Jul 20 '17 10:07 RomanNagornyi

I still have the same issue, can anybody help please? <ng-select [multiple]="true" [items]="furniture" placeholder="No furnitre selected"> furniture: Array = [ { "id": 1, "text": "Table" }, { "id": 2, "text": "Chair" }, { "id": 3, "text": "Light" }

];

ChandraTerli avatar May 16 '18 14:05 ChandraTerli