The ng:bind-attr
attribute specifies that the element attributes
which should be replaced by the expression in it. Unlike ng:bind
the ng:bind-attr
contains a JSON key value pairs representing
which attributes need to be changed. You don’t usually write the
ng:bind-attr
in the HTML since embedding
{{expression}} into the
attribute directly is the preferred way. The attributes get
translated into <span ng:bind-attr="{attr:expression}"/>
at
bootstrap time.
This HTML snippet is preferred way of working with ng:bind-attr
<a href="http://www.google.com/search?q={{query}}">Google</a>
The above gets translated to bellow during bootstrap time.
<a ng:bind-attr='{"href":"http://www.google.com/search?q={{query}}"}'>Google</a>
<ANY ng:bind-attr="attribute_json"> ... </ANY>
attribute_json – {string} –
a JSON key-value pairs representing the attributes to replace. Each key matches the attribute which needs to be replaced. Each value is a text template of the attribute with embedded {{expression}}s. Any number of key-value pairs can be specified.
Try it here: enter text in text box and click Google.