fix(compiler): improve error msg for unknown properties on (#14373)

ng-container/ng-content

Closes #14070

PR Close #14373
This commit is contained in:
Dzmitry Shylovich 2017-02-09 21:22:44 +03:00 committed by Miško Hevery
parent 2c6dab970b
commit e5a144d902
2 changed files with 15 additions and 1 deletions

View File

@ -729,7 +729,11 @@ class TemplateParseVisitor implements html.Visitor {
!this._schemaRegistry.hasProperty(elementName, boundProp.name, this._schemas)) { !this._schemaRegistry.hasProperty(elementName, boundProp.name, this._schemas)) {
let errorMsg = let errorMsg =
`Can't bind to '${boundProp.name}' since it isn't a known property of '${elementName}'.`; `Can't bind to '${boundProp.name}' since it isn't a known property of '${elementName}'.`;
if (elementName.indexOf('-') > -1) { if (elementName.startsWith('ng-')) {
errorMsg +=
`\n1. If '${boundProp.name}' is an Angular directive, then add 'CommonModule' to the '@NgModule.imports' of this component.` +
`\n2. To allow any property add 'NO_ERRORS_SCHEMA' to the '@NgModule.schemas' of this component.`;
} else if (elementName.indexOf('-') > -1) {
errorMsg += errorMsg +=
`\n1. If '${elementName}' is an Angular component and it has '${boundProp.name}' input, then verify that it is part of this module.` + `\n1. If '${elementName}' is an Angular component and it has '${boundProp.name}' input, then verify that it is part of this module.` +
`\n2. If '${elementName}' is a Web Component then add 'CUSTOM_ELEMENTS_SCHEMA' to the '@NgModule.schemas' of this component to suppress this message.` + `\n2. If '${elementName}' is a Web Component then add 'CUSTOM_ELEMENTS_SCHEMA' to the '@NgModule.schemas' of this component to suppress this message.` +

View File

@ -380,6 +380,16 @@ Can't bind to 'invalidProp' since it isn't a known property of 'my-component'.
3. To allow any property add 'NO_ERRORS_SCHEMA' to the '@NgModule.schemas' of this component. ("<my-component [ERROR ->][invalidProp]="bar"></my-component>"): TestComp@0:14`); 3. To allow any property add 'NO_ERRORS_SCHEMA' to the '@NgModule.schemas' of this component. ("<my-component [ERROR ->][invalidProp]="bar"></my-component>"): TestComp@0:14`);
}); });
it('should throw error when binding to an unknown property of ng-container', () => {
expect(() => parse('<ng-container [invalidProp]="bar"></ng-container>', []))
.toThrowError(
`Template parse errors:
Can't bind to 'invalidProp' since it isn't a known property of 'ng-container'.
1. If 'invalidProp' is an Angular directive, then add 'CommonModule' to the '@NgModule.imports' of this component.
2. To allow any property add 'NO_ERRORS_SCHEMA' to the '@NgModule.schemas' of this component.` +
` ("<ng-container [ERROR ->][invalidProp]="bar"></ng-container>"): TestComp@0:14`);
});
it('should throw error when binding to an unknown element w/o bindings', () => { it('should throw error when binding to an unknown element w/o bindings', () => {
expect(() => parse('<unknown></unknown>', [])).toThrowError(`Template parse errors: expect(() => parse('<unknown></unknown>', [])).toThrowError(`Template parse errors:
'unknown' is not a known element: 'unknown' is not a known element: