Ishitva Goel Ishitva Goel - 6 months ago 32
AngularJS Question

Why can't we use interpolation expression with "ng-model" but can use with "ng-src"?

I am trying to use the interpolation expression with the ng-model directive but it doesn't work. On the contrary when I use interpolation with ng-src, it works perfectly fine. What is this difference due to ?


It all depends upon how the directive has been setup.

Some directives like ng-model, ng-show and ng-click do not use interpolation symbols whereas directives ng-src take interpolation.

Interpolation are supported on directives that work only with strings. If we look at ng-src implementation you will find

 attr.$observe(normalized, function(value) {
          if (!value)

          attr.$set(attrName, value);

          if (msie) element.prop(attrName, attr[attrName]);

attr.$observe watches for change in attribute not model. Model changes cause attribute changes (due to interpolation), hence causing the trigger to fire.

For all other directives like ng-model, the attribute value is an expression which is evaluated in current scope and is not limited to string value.

If you are developing your own directives, isolated scope properties = and @ help you achieve something similar.