I have a angularJS application, in which I have an array.
$scope.data[0] = x1;
$scope.data[1] = x2;
and a text area
<textarea ng-model="data"> </textarea>
I can see the that textarea contains values x1, x2 (separated by comma). I want to show the values on separate lines. Meaning all array values should be separated by new line character not by comma. Do I need to write filter for this?
This is exactly what ng-list does:
<textarea ng-model="someArray" ng-list="/\n/"></textarea>
This also works on all other kinds of inputs as it hooks into ngModels parsers/formatters.
See this fiddle: http://jsfiddle.net/xbYzT/1/
The problem with this is that ng-list always joins with a ',' as the separator, so it's not really bi-directional.
ngList always joins an existing array with , as the separator, ignoring the user-selected separator - even if it is not a regex.
A much easier way to do this in Angular >= 1.3 which works both ways:
<textarea ng-model="yourStringArray" ng-list=" " ng-trim="false"></textarea>
You can write a directive that modifies how ng-model converts variables into input values and back. I'm just writing this off the top of my head, so I have no idea if it's exactly right, but something like this might do it:
app.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);
}
};
});
And you can use it like this:
<textarea ng-model="data" split-array> </textarea>
