Compiled angular 5 files trigger an error at runtime "No value accessor for form control with name:"

Question

I'm trying to update a package (ng-selector) from angular 4 to 5, and I can't get it to work correctly.

From what I understand, since Angular 5 is only compiling files from the application folder, to use a package from the node_modules folder, my package needs to expose js files.

To expose js files in my packages (which only exposed ts files until now), I've tried both tsc ang ngc. Here is the problem : no matter what compiler I use, I don't get compilations error. But when I import my package from js files and try to use it, I always get an error on my console saying :

ERROR Error: No value accessor for form control with name: 'test1'

I know that in most cases, this error comes from one of the following ones mistake :

• I forgot to include the FormsModule
• I did not implement correctly ControlValueAccessor
• I did not use the provider NG_VALUE_ACCESSOR

I'm saving you the trouble to check, it is not the case here. My package was working fine with Angular 4.

It is a problem with the compilation of my typescript files, because if I put my package files directly into my appplication folder, change the import (instead of importing from node_modules folder, I import from the local package files), then everything works fine.

If anyone want to try what I did, here is the reproduce steps :

1. git clone [email protected]:Orodan/ng-selector.git
2. cd ng-selector
3. git checkout develop
4. npm install
5. npm run build-tsc or npm run build-ngc according to what compilation you want to test
6. cd ngSelectorDemo
7. npm install
8. npm start

I suppose I'm doing something wront with my compilation settings, but I can't found what exactly. So if anyone could help

Thanks for the help :)

Answer 1

I've suffered same issue, It was ok in a single-package app but when I extracted the control into a separated package (using roll-up), then it throws "No value accessor for form control with name: xxxx” error.

The error message was disappeared if I add a "ngDefaultControl" directive, but I think it is a work-around, not the right solution. If anyone knows a permanent solution, please let us know. Thank you.