Primeng: Error with Angular2 RC4: No value accessor for ''

[rktawni]

When I migrated my app to angular 2 RC4 I am getting error "No value accessor for "" " on the line where I am using p-calendar.

[MarkPerryBV]

I am also getting the same error with all the controls.

[sdmoralesma]

In many cases the problem is that you are using [(ngModel)] (_I know: the showcase has it like that_), try to change it to: [(model)] and that should fix it. The explanation seems to be that ngModel was already defined and we can not reuse it (source: http://stackoverflow.com/a/34496633/2011421)

Let me know if this solution suits you.

[MarkPerryBV]

I have resolved my earlier issue with this error. Turns out I had not updated my libs bundle with the latest RC.4 code.

I am still however getting an error when trying to use a single <p-checkox> control.

If I use the following syntax: <p-checkbox [(ngModel)]="myVal" ></p-checkbox> I get an error from Angular asking me to add the the name attribute to the element.

When I change the syntax to:

<p-checkbox [(ngModel)]="myVal" name="myName"></p-checkbox>

The page now loads but when I click on the checkbox to save the value I am getting the following error:

TypeError: this.model.push is not a function which is because I think PrimeNG is thinking I have more than one checkbox element because I have supplied the name attribute.

[DaanDD]

I had the same problem, I solved it by updating to the new form providers in the bootstrap function (disableDeprecatedForms and provideForms), like this:

import {bootstrap} from '@angular/platform-browser-dynamic';
import {provide} from '@angular/core';
import {AppComponent} from './app.component'
import {disableDeprecatedForms, provideForms} from '@angular/forms';

bootstrap(AppComponent, [
  disableDeprecatedForms(),
  provideForms(),
]);

[rktawni]

@sdmoralesma Although your solution is good to resolve the error but it makes one way binding. I need my calendar to be two way binded.

[rktawni]

@DaanDD Your solution resolved my issue. It would be great if you can explain the root cause of the issue for that we all can understand it batter.

Many Thanks to everyone!

[nandodrw]

Hi. I'm having the same issue with the autoComplete.

Referencing this stackoverflow question, looks like there are some requirements that a component (in this case primeng component) should follow before use [(ngModel)] binding. This was diferent on the rc1.

If you check this documents from angular 2 looks that the way to get the double data binding working is set (ngModel)="your.Variable" and (ngModelChange)="your.Variable=$primengEvent" on your markup.

Maybe is just me, but since the angular team is doing such deep changes on the framework API, sound crazy using angular2 on production projects for now, specially if we try to use it with external libraries like primeng.

[sdmoralesma]

Yes you are right, Neither PrimeNG(beta) or Angular2(RC) are production ready by now. However you can still use them in small projects and report bugs/create pull requests so they mature faster. Keep in mind that the release date of both is still undefined (although 4th quarter of the year is probable)

[nandodrw]

Good point, still playing with the library will help everybody.

[sievert]

The solution that worked for me:

https://angular.io/docs/ts/latest/guide/forms.html

import { disableDeprecatedForms, provideForms } from '@angular/forms';

bootstrap(AppComponent, [
disableDeprecatedForms(),
provideForms()

[mshantic]

Thanks! @DaanDD and @sievert, solved the problem for me. After updating to rc4 and the new PrimeNG beta 9 this gave me such a headache

[PardeepJain]

@sdmoralesma as per your suggestion usage of [(model)] removes error but i did't make two way data binding at all in any component. is there any alternate for the same ?

[sievert]

... use [(ngModel)] and the new forms, as I already said 2 posts before ...

[PardeepJain]

@sievert already tried still got the same error No value accessor for ''

[cagataycivici]

Please also check;

http://forum.primefaces.org/viewtopic.php?f=35&t=46238

[MChouaiar]

Hi,
I still have the same error, any one have other suggestions please.

[MarkPerryBV]

@MLC1435 - Check that you have added the relevant Class into your @Component({directives:[]});

I always miss that. I am using NG RC.4 and PrimeNG beta.11 with no issues.

[akumar-enbake]

HI ,
I have same error :
EXCEPTION: Error: Uncaught (in promise): EXCEPTION: Error in build/pages/messageDetail/messageDetail.html:23:18
ORIGINAL EXCEPTION: No value accessor for ''
ORIGINAL STACKTRACE:
Error: No value accessor for ''

I ## use this in IONIC 2 application but i't not working

import { disableDeprecatedForms, provideForms } from '@angular/forms';

bootstrap(AppComponent, [
disableDeprecatedForms(),
provideForms()

[aneesazam]

@DaanDD Thank you so much, I was facing same issue which has gone now.

[aneesazam]

@nandodrw, I am working with autocomplete advance like dropdown which is working well here. I got some issues but now working well. Let me know what can I do for you?

[guzhi3261]

@nandodrw, I am working with autocomplete advance like dropdown which is working well here. I got some issues but now working well. Let me know what can I do for you?
i use dropdown in my program, use http get for the data , the data can got but dropdown `s list is nothing