Unknown element not detected when a directive is applied
See original GitHub issueWhich @angular/* package(s) are the source of the bug?
core
Is this a regression?
No
Description
Applying a known directive to an unknown element, causes Angular to compile without errors.
<!-- throws: 'i-dont-exist' is not a known element: -->
<i-dont-exist></i-dont-exist>
<!-- compiles without error -->
<i-dont-exist [ngStyle]="{ color: 'red ' }"></i-dont-exist>
This behaviour enables regressions through element selector typos. Introducing a typo results in no component being rendered, yet it doesn’t produce any compilation errors.
<my-element [ngModel]="value"></my-element>
<my-element-with-a-typo [ngModel]="value"></my-element-with-a-typo>
Please provide a link to a minimal reproduction of the bug
Please provide the environment you discovered this bug in (run ng version
)
Angular CLI: 14.0.7
Node: 14.18.2
Package Manager: npm 6.14.17
OS: darwin x64
Angular: 14.1.0
... animations, common, compiler, compiler-cli, core, forms
... platform-browser, platform-browser-dynamic, router
Package Version
---------------------------------------------------------
@angular-devkit/architect 0.1401.0
@angular-devkit/build-angular 14.1.0
@angular-devkit/core 14.1.0
@angular-devkit/schematics 14.0.7
@angular/cli 14.0.7
@schematics/angular 14.0.7
rxjs 7.5.6
typescript 4.7.4
Issue Analytics
- State:
- Created a year ago
- Reactions:5
- Comments:5 (3 by maintainers)
Top Results From Across the Web
Angular2 Can't bind to DIRECTIVE since it isn't a known ...
Angular2 Can't bind to DIRECTIVE since it isn't a known property of element · The result I need is [(appContenteditableModel)]="draftMessage.text ...
Read more >NG8001: Unknown HTML element or component
Use the element name in the error to find the file(s) where the element is being used. Check that the name and selector...
Read more >Angular Directive Tutorial With Example | Custom Directives
Angular creates a new instance of the directive's class for each matching element, injecting an Angular ElementRef into the constructor.
Read more >core - Apache HTTP Server Version 2.4
Nonfatal=Unknown treats unknown directives as nonfatal. This covers typos and directives implemented by a module that's not present.
Read more >CSP: script-src - HTTP - MDN Web Docs - Mozilla
The HTTP Content-Security-Policy (CSP) script-src directive ... This includes not only URLs loaded directly into <script> elements, ...
Read more >Top Related Medium Post
No results found
Top Related StackOverflow Question
No results found
Troubleshoot Live Code
Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start FreeTop Related Reddit Thread
No results found
Top Related Hackernoon Post
No results found
Top Related Tweet
No results found
Top Related Dev.to Post
No results found
Top Related Hashnode Post
No results found
Top GitHub Comments
I suspect that the code was written in this way to capture the case where the element isn’t known, but there’s a directive matching the specific tag name, but it’s currently verifying that any directive matches the element which is incorrect. See https://github.com/angular/angular/blob/main/packages/core/src/render3/instructions/element_validation.ts#L84.
This issue has been automatically locked due to inactivity. Please file a new issue if you are encountering a similar or related problem.
Read more about our automatic conversation locking policy.
This action has been performed automatically by a bot.