Oh hi there! 😄
To expedite issue processing please search open and closed issues before submitting a new one. Existing issues often contain information about workarounds, resolution, or progress updates.
<!-- Can you pin-point one or more @angular/* packages as the source of the bug? --> <!-- ✍️edit: --> The issue is caused by package @angular/element, @angular/forms and @angular/reactiveForms
<!-- ✍️--> I've being trying to create custom elements with angular elements and for form inputs I've being trying to use angular's ControlValueAccessor for that as discussed in this article by Eliran Eliassy.
But when I follow the guide, and completed the code - I ran into this problem. No provider for NgControl. I have already imported FormsModule and ReactiveFormsModule to app.module.ts file which is the remedy for this error (as normal). But it haven't fixed this time.
The problem seems to be with the Angular Elements where when we create angular element we have to pass the component to entryComponents and that leads to angular compiles it factory even that it's not on the template, and because it's not part of any form and doesn't have any From directive on it -> which gives the error No Provider For NgControl
Later on i have added @Optional() decorator for this. But that leads to ValueAccessor to be null and all other form input actions break.
If i use this without angular elements (as a normal element), that seems to work. I think this is some problem in @angular/elements package. Anyone got a clue?
<!-- Please create and share minimal reproduction of the issue starting with this template: https://stackblitz.com/fork/angular-issue-repro2 --> <!-- ✍️--> You can use this StackBlitz to reproduce the error
If StackBlitz is not suitable for reproduction of your issue, please create a minimal GitHub repository with the reproduction of the issue.
A good way to make a minimal reproduction is to create a new app via
ng new repro-app and add the minimum possible code to show the problem.
Share the link to the repo below along with step-by-step instructions to reproduce the problem, as well as expected and actual behavior.
Issues that don't have enough info and can't be reproduced will be closed.
You can read more about issue submission guidelines here: https://github.com/angular/angular/blob/master/CONTRIBUTING.md#-submitting-an-issue -->
<pre><code>Error:- Template parse errors: No provider for NgControl</code></pre> And <pre><code>ERROR TypeError: Cannot set property 'valueAccessor' of null Template parse errors: No provider for NgControl</code></pre>
Angular Version: <pre><code>Angular 8.2</code></pre>
Thanks @trotyl and @atscott for the commitment
Fixed the error by adding the ngDefaultControl as a directive in the custom element and implementing the part of the ControlValueAccessor manually.
Here is an example of implementation (Don't mind the validation part, not finished yet) StackBlitz