angular-ngselect

ng-select reusable templates

廉价感情. 提交于 2021-02-19 09:28:36
问题 I'm using ng-select (https://github.com/ng-select/ng-select) library to work with multiselect drop down lists. It works great but now I need to reuse my ng-templates and I'm kind of lost. I started working on Angular 10 a few weeks ago and Googled enough to realize I need some help. My ng-template looks like this: <ng-template ng-header-tmp let-item$="item$"> <div> <input type="text" appAutofocus class="form-control input-sm ng-select-search-box" placeholder="Filter" (input)="ngSelectControl

ng-select reusable templates

萝らか妹 提交于 2021-02-19 09:27:37
问题 I'm using ng-select (https://github.com/ng-select/ng-select) library to work with multiselect drop down lists. It works great but now I need to reuse my ng-templates and I'm kind of lost. I started working on Angular 10 a few weeks ago and Googled enough to realize I need some help. My ng-template looks like this: <ng-template ng-header-tmp let-item$="item$"> <div> <input type="text" appAutofocus class="form-control input-sm ng-select-search-box" placeholder="Filter" (input)="ngSelectControl

@ng-select addTag, how to validate after add the new tag?

♀尐吖头ヾ 提交于 2021-02-08 05:44:41
问题 i am using @ng-select/ng-select html file <ng-select [items]="_Customers" [addTag]="addTagPromise" [bindLabel]="'name'" [(ngModel)]="selectedCustomer"> </ng-select> addTag is working but addTagPromise function inside already defined values not accessible ts file _Customers: any[] = []; companies = ['company one', 'company Two', 'company three']; selectedCustomer; ngOnInit() { this.companies.forEach((c, i) => { this._Customers.push({ id: i, name: c }); }); } addTagPromise(name) { console.log

@ng-select addTag, how to validate after add the new tag?

元气小坏坏 提交于 2021-02-08 05:44:22
问题 i am using @ng-select/ng-select html file <ng-select [items]="_Customers" [addTag]="addTagPromise" [bindLabel]="'name'" [(ngModel)]="selectedCustomer"> </ng-select> addTag is working but addTagPromise function inside already defined values not accessible ts file _Customers: any[] = []; companies = ['company one', 'company Two', 'company three']; selectedCustomer; ngOnInit() { this.companies.forEach((c, i) => { this._Customers.push({ id: i, name: c }); }); } addTagPromise(name) { console.log

ng select style group headers and items

安稳与你 提交于 2021-01-28 14:20:29
问题 I am using ng-select (https://ng-select.github.io/ng-select#/data-sources) library in my angular project to display a drop down as follows: <ng-select [items]="flattenedSelectList" bindLabel="displayName" placeholder="Select specialty" notFoundText="No results found. Please try a different search criteria." bindValue="id" groupBy="type" [(ngModel)]="selectedSpecialtyId"> </ng-select> I want to style the group header and also the items inside each group? How can I do it? I used the following

How to always display a placeholder of ng-select?

江枫思渺然 提交于 2021-01-28 05:30:49
问题 I am using ng-select in my angular application and have quite an unusual use case. I need to always display the placeholder, even on option selected. With current code the placeholder is replaced with the value of selected option: <ng-select [(ngModel)]="selectedApplication" class="application-switcher" [attr.data-sel-id]="selId" [clearable]="false" appendTo="body" [searchable]="false" placeholder="{{ 'APP_TITLE' | translate }}" [virtualScroll]="virtualScroll" [markFirst]="false"> <ng-option

ng-select multi select checkbox with reactive forms in angular 6

本秂侑毒 提交于 2021-01-26 07:30:21
问题 Please go through the link(https://ng-select.github.io/ng-select#/multiselect-checkbox) to know ng-select multi select checkbox. I am trying to use the ng-select "Group selects children" in my angular 6 application. I am having problem using ng-select "Group selects children" with Reactive Forms instead of template driven forms. I have tired it as <ng-select [items]="userGroupsList" [multiple]="true" bindLabel="name" groupBy="gender" [selectableGroup]="true" [selectableGroupAsModel]="false"

Validation is not propagate to Custom Form Control ng-select in Angular

杀马特。学长 韩版系。学妹 提交于 2020-06-28 03:53:21
问题 I'm using Reactive Form with Custom Form Control in my Angular 9 application. I wrapped my ng-select control with Custom Form Control. And I have problem with validation. I set formControl to be required. Documentation says that ng-invalid css class should be set to ng-select automatically. But in fact with custom form control it doesn't work properly. The css class is not set, but the wrapper class is. Am I doing something wrong or this is library issue? Check stackblitz: https://stackblitz

set selected value in angular5 ng-select programmaticaly

心已入冬 提交于 2020-01-11 12:15:10
问题 I'm using angular5 ng-select component: https://github.com/ng-select/ng-select and try to set the selected value (programatically) when the container component first loaded (kind of default selected value set in the model). I didn't find any relevant attribute for it or for the isSelected for each item. Here is my code (filtered): HTML: <ng-select [items]="filter.values" bindLabel="text" bindValue="id" class="input-md" [(ngModel)]="filter.selectedValue"></ng-select> Model: export class

ng-select - Change height

风格不统一 提交于 2019-12-25 01:14:34
问题 I am using the ng-select library https://github.com/ng-select/ for Angular 5 at version 1.4.2. I want to customize it so the height of the ng-select is smaller. How can this be achieved? I have had a look at customizing with styles at https://github.com/ng-select/ng-select#custom-styles but cannot get it to work. I have added a customized CCS with an attempt to do this. Here is my code of the ng-select <label class="col-sm-4 text-sm-right col-form-label">Payout Format</label> <div class="col