Question

I was a bit puzzled by my

<input ng-bind="x.a * x.b" tabindex="-1" readonly/>

expression not working. I can't use ng-model there (as the product is no L-value), so I blindly switched to ng-bind. I guess, it doesn't work because of the funny HTML inconsistency (using value=xxx instead of placing the value in the element text). So I switched to

<input value="{{x.a * x.b}}" tabindex="-1" readonly/>

which solved the problem, but shouldn't input ng-bind work anyway? AFAIK jQuery val() does. Am I doing something wrong?

Side questions:

  • Is it a bad practice to use inputs which are always readonly?
  • If so, what's the recommended way? span or label or what?
Was it helpful?

Solution

ngBind set's the element's text content:

element.text(value == undefined ? '' : value);   // from the source code of Angular

So, it does not work for setting the value of an input (nor shouldn't it).

I believe it is better to use <span> in place of readonly inputs.

Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow
scroll top