style(buildElementPropertyBindings): improve error message when attem…

…pting to bind to an known property Currently we alert the user that no such property exists for the given element, but we could indicate that if user is attempting to bind to an attribute then the attr. prefix should be used. Part of angular#4385
nosachamos · Sep 28, 2015 · 429b9c0 · 429b9c0
1 parent a88e6f3
commit 429b9c0
Show file tree

Hide file tree

Showing 4 changed files with 4 additions and 16 deletions.
diff --git a/.settings/settings.json b/.settings/settings.json
diff --git a/modules/angular2/src/core/render/dom/view/proto_view_builder.ts b/modules/angular2/src/core/render/dom/view/proto_view_builder.ts
@@ -355,7 +355,7 @@ function buildElementPropertyBindings(
 
       // directiveTemplatePropertyNames is null for host property bindings
       if (isPresent(directiveTemplatePropertyNames)) {
-        exMsg += ' and there are no matching directives with a corresponding property';
+        exMsg += ' and there are no matching directives with a corresponding property. If this is an attribute, make sure to prefix its name with \'attr.\'';
       }
       throw new BaseException(exMsg);
     }

diff --git a/modules/angular2/test/core/compiler/integration_spec.ts b/modules/angular2/test/core/compiler/integration_spec.ts
@@ -1457,7 +1457,7 @@ export function main() {
 
                      PromiseWrapper.catchError(tcb.createAsync(MyComp), (e) => {
                        expect(e.message).toEqual(
-                           `Can't bind to 'unknown' since it isn't a known property of the '<div>' element and there are no matching directives with a corresponding property`);
+                           `Can't bind to 'unknown' since it isn't a known property of the '<div>' element and there are no matching directives with a corresponding property. If this is an attribute, make sure to prefix its name with \'attr.\'`);
                        async.done();
                        return null;
                      });

diff --git a/modules/angular2/test/core/render/dom/view/proto_view_builder_spec.ts b/modules/angular2/test/core/render/dom/view/proto_view_builder_spec.ts
@@ -39,7 +39,7 @@ export function main() {
           builder.bindElement(el('<div/>')).bindProperty('unknownProperty', emptyExpr());
           expect(() => builder.build(new DomElementSchemaRegistry(), templateCloner))
               .toThrowError(
-                  `Can't bind to 'unknownProperty' since it isn't a known property of the '<div>' element and there are no matching directives with a corresponding property`);
+                  `Can't bind to 'unknownProperty' since it isn't a known property of the '<div>' element and there are no matching directives with a corresponding property. If this is an attribute, make sure to prefix its name with \'attr.\'`);
         });
 
         it('should allow unknown properties if a directive uses it', () => {
@@ -70,7 +70,7 @@ export function main() {
           binder.setComponentId('someComponent');
           expect(() => builder.build(new DomElementSchemaRegistry(), templateCloner))
               .toThrowError(
-                  `Can't bind to 'unknownProperty' since it isn't a known property of the '<some-custom>' element and there are no matching directives with a corresponding property`);
+                  `Can't bind to 'unknownProperty' since it isn't a known property of the '<some-custom>' element and there are no matching directives with a corresponding property. If this is an attribute, make sure to prefix its name with \'attr.\'`);
         });
 
       });