Custom attribute gives parsing error when using with an angular 2.0.0-beta.0

Question

I'm trying to use custom attribute with angular2 as following

 <a href="javascript:void(0)" title="{{inst.title}}" data-loc="{{inst.actionval}}">

which gives me following error

EXCEPTION: Template parse errors: Can't bind to 'loc' since it isn't a known native property

Answer 1

Angular by default uses property binding but a doesn't have a property data-loc. To tell Angular explicitly to use attribute binding, use instead: try this one may work for you.

<a href="javascript:void(0)" title="{{inst.title}}" [attr.data-loc]="inst.actionval">

or

<a href="javascript:void(0)" title="{{inst.title}}" attr.data-loc="{{inst.actionval}}">