Add a prefix/suffix to value of input tag
Using ng-model="data"
in <input type="text">
binds the data
with entire text field. This is not particularly useful in situations where you want only a portion of text(being displayed in text field) to get bind with the scope.
For instance, if you do
<input type="text" value="prefixText {{name}} suffixText" ng-model="name">
The input box will display whatever is in name
(with no prefix/suffix text)
However, there's a workaround. Use ng-bind
on the variable and mention prefix/suffix text separately in the value="..."
attribute.
<input type="text" value="prefixText {{name}} suffixText" ng-bind="name">
Here's the demo