No value accessor for form control with unspecified name attribute Angular 2

Question

I'm using ng2-select Click here! lib but this error is show :

No value accessor for form control with unspecified name attribute

using angular2
in html file same as link in top
in ts my component same as link in top
in modules.ts add : import { SelectModule } from 'ng2-select'; and : imports :[ SelectModule , ]

Can anyone help me to fix this error plz ?

 <div style="width: 300px; margin-bottom: 20px;">
 <h3>Select a single city</h3>
 <ng-select [allowClear]="true"
          [items]="items"
          [disabled]="disabled"
          (data)="refreshValue($event)"
          (selected)="selected($event)"
          (removed)="removed($event)"
          (typed)="typed($event)"
          placeholder="No city selected">
</ng-select>
<p></p>
<pre>{{value.text}}</pre>
<div>
  <button type="button" class="btn btn-primary"
        [(ngModel)]="disabledV" btnCheckbox
        btnCheckboxTrue="1" btnCheckboxFalse="0">
  {{disabled === '1' ? 'Enable' : 'Disable'}}
   </button>
  </div>
</div>

in ts compmonent:

 import { Component, OnInit } from '@angular/core';
 import { SelectItem } from 'ng-select/ng2-select'
 @Component({
  selector: 'app-api-two',
  templateUrl: './api-two.component.html',
  styleUrls: ['./api-two.component.css'],
 })
  export class ApiTwoComponent implements OnInit {

  constructor() { }

 ngOnInit() {
 }
  public items:Array<string> = ['Amsterdam', 'Antwerp', 'Athens', 
   'Barcelona',
  'Berlin', 'Birmingham', 'Bradford', 'Bremen', 'Brussels', 'Bucharest',
  'Budapest', 'Cologne', 'Copenhagen', 'Dortmund', 'Dresden', 'Dublin',
  'Düsseldorf', 'Essen', 'Frankfurt', 'Genoa', 'Glasgow', 'Gothenburg',
  'Hamburg', 'Hannover', 'Helsinki', 'Kraków', 'Leeds', 'Leipzig', 'Lisbon',
  'London', 'Madrid', 'Manchester', 'Marseille', 'Milan', 'Munich', 
   'Málaga',
  'Naples', 'Palermo', 'Paris', 'Poznań', 'Prague', 'Riga', 'Rome',
  'Rotterdam', 'Seville', 'Sheffield', 'Sofia', 'Stockholm', 'Stuttgart',
  'The Hague', 'Turin', 'Valencia', 'Vienna', 'Vilnius', 'Warsaw', 
  'Wrocław',
  'Zagreb', 'Zaragoza', 'Łódź'];

private value:any = {};
public valueName:string='';
private _disabledV:string = '0';
private disabled:boolean = false;

private get disabledV():string {
  return this._disabledV;
}

private set disabledV(value:string) {
  this._disabledV = value;
  this.disabled = this._disabledV === '1';
}

public selected(value:any):void {
  console.log('Selected value is: ', value);
}

public removed(value:any):void {
  console.log('Removed value is: ', value);
}

public typed(value:any):void {
  console.log('New search input: ', value);
}

public refreshValue(value:any):void {
  this.value = value;
}
}

Thanks You.

Your error doesn't seem to come from here. If you think it's library related, consider removing it and installing it again. — , Sep 04 '18 at 06:35
in [link](https://valor-software.com/ng2-select/) say add this but not tell where add // class Select @Component({ selector: 'ng-select', properties: [ 'allowClear', 'placeholder', 'items', 'multiple', 'showSearchInputInDropdown'] }) — Emad joha, Sep 04 '18 at 06:38
It doesn't tell you to add it, it tells you what properties you can use on your `ng-select` selector. — , Sep 04 '18 at 06:40
i'm know from error from html binding the html file not undefined to property binding like [allowClear] or [items] — Emad joha, Sep 04 '18 at 06:43
how can me add this property to know htnl file like (click) event — Emad joha, Sep 04 '18 at 06:44

score 9 · Accepted Answer · answered Sep 04 '18 at 06:39

9

You should add the ngDefaultControl attribute to your input like this:

<div>
  <button type="button" class="btn btn-primary"
        [(ngModel)]="disabledV" btnCheckbox
        btnCheckboxTrue="1" btnCheckboxFalse="0" ngDefaultControl>
        {{disabled === '1' ? 'Enable' : 'Disable'}}
   </button>
 </div>

answered Sep 04 '18 at 06:39

Aniket Avhad

4,025
2
23
29

2

Please explain what this does (with either a link or your own description) – Sep 04 '18 at 06:44
https://stackoverflow.com/questions/46465891/what-is-ngdefaultcontrol-in-angular find the description on this link – Aniket Avhad Sep 04 '18 at 06:45

No value accessor for form control with unspecified name attribute Angular 2

1 Answers1