Brian Triplett
Brian Triplett

Reputation: 3532

Angular Components: What is the difference between one-way and attribute bindings?

I've been building a few angular components and was wondering what are the practical difference between the one-way ("<") and attribute ("@") bindings?

Are there scenarios where one is preferable over the other? It is simple that attributes are always immutable strings and must be interpolated?

Upvotes: 1

Views: 410

Answers (1)

ScottL
ScottL

Reputation: 1755

From https://docs.angularjs.org/guide/component:

@ bindings can be used when the input is a string, especially when the value of the binding doesn't change.

From https://docs.angularjs.org/api/ng/service/$compile#-scope-

"@" - bind a local scope property to the value of DOM attribute. The result is always a string since DOM attributes are strings.

"<" - set up a one-way (one-directional) binding between a local scope property and an expression passed via the attribute

So, use '@' for passing string values. The value could be a simple string value, e.g. myattr="hello", or it could be an AngularJS interpolated string with embedded expressions, e.g. myattr="my_{{helloText}}".

Upvotes: 1

Related Questions