Angular 2 (Can't bind to X since it isn't a known property...)

[Micael Pedrosa]

I'm testing Angular 2 (2.0.0-alpha.34), and I'm getting a lot of these kind of errors.

Like for example, this should work

  on template:

    <ul [class]="classTypes" ...>

  on class

    classTypes = "collapsible popout";

But returns: "Can't bind to 'class' since it isn't a known property of the '<ul>' element and there are no matching directives with a corresponding property"

[Pawel Kozlowski]

On Fri, Aug 14, 2015 at 4:40 PM, Micael Pedrosa <micael...@gmail.com> wrote:
> But returns: "Can't bind to 'class' since it isn't a known property of the
> '<ul>' element and there are no matching directives with a corresponding
> property"

Right, this is correct, since by default ng2 is binding to HTML
element properties and there is no "class" property, there is only
"class" attibute.
There is a "className" property so if you want to change this, you
might want to do:

<ul [class-name]="classTypes" ...>

Are you following any particular example / doc or just trying things out?

Cheers,
Pawel

--
AngularJS book:
http://www.packtpub.com/angularjs-web-application-development/book
Looking for bootstrap-based widget library for AngularJS?
http://angular-ui.github.com/bootstrap/

[Micael Pedrosa]

OK (probably because it's a reserved word), maybe this should be a good place for an exception (translating [class] to class-name property binding) ?

I'm doing some integration tests with angular2 and materializecss. 

Because of this I also need to build some directives to support "data-tooltip" and other attributes used by materialize.

Is there any simple way to add properties to a DOM node, and be recognized by angular?

[Pawel Kozlowski]

We've actually added special casing (class -> className) in
https://github.com/angular/angular/commit/a7a1851c0f0a416fb7ccbf4c8a3f29bd431f992a
You can check this commit to see how to add more aliases.

Alternatively you can use the CSSCclass directive that "knows" hot to
mutate CSS classes.

Cheers,
Pawel

> --
> You received this message because you are subscribed to the Google Groups
> "AngularJS" group.
> To unsubscribe from this group and stop receiving emails from it, send an
> email to angular+u...@googlegroups.com.
> To post to this group, send email to ang...@googlegroups.com.
> Visit this group at http://groups.google.com/group/angular.
> For more options, visit https://groups.google.com/d/optout.