StackOverflow2013

Note that there are some explanatory texts on larger screens.

plurals

POAngularJS model bound with two fields
text
Body
copied!<p>I have an object like following:</p> <pre><code> MyObj{ Groups:[{name:"test1": xdata:"[1,2,3]" }, {name:"test2": xdata:"[5,6,7]" }] } </code></pre> <p>I have to represent these values in two different views on the same page. First view renders xData and yData in textareas, it uses SplitArray directive to display values 1,2,3 one value at each line in a text area. </p> <pre><code> <textarea split-array="" ng-model="group.xdata" > </textarea> </code></pre> <p>Second view shows these values in textboxes. xData split into three textboxes like following</p> <pre><code> <input type="text" ng-model="group.xdata[0]" > <input type="text" ng-model="group.xdata[1]" > </code></pre> <p>Following is the SplitArray directive</p> <pre><code>myModule.directive('splitArray', function() { return { restrict: 'A', require: 'ngModel', link: function(scope, element, attr, ngModel) { function fromUser(text) { return text.split("\n"); } function toUser(array) { return array.join("\n"); } ngModel.$parsers.push(fromUser); ngModel.$formatters.push(toUser); } }; }) </code></pre> <p>When I make a change in view1(textarea) I can correctly see the changed values in second view (textboxes) but when I make a change in view2 the change is not reflected back in the textareas. When I do a console.log on change in textboxes I can see the model shows new values. My question is why the model changes are not being reflected back in textareas, do I need to make some change in splitArray directive?</p>

Querying!

Guidance

An individual column

Larger individual text columns get their own page to allow for proper reading.

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload