When binding input value to an ng-model like so:

<input type="text" ng-model="array">

how do I bind the input text as an array? So if I input one, two, three, the resulting model will be [ "one","two","three ].

Right now this is how I'm achieving this:

<input type="text" ng-model="string" ng-change="convertToArray()">

And in my controller:

$scope.convertToArray = function(){
    $scope.array = $scope.string.split(',');
}

It works fine but I don't think it's best practice because I'm making a $scope.string variable and then hardcoding the destination array.

Is it possible to just have the input's model set into array and then have the input pass through the function before being bound to the scope?

When binding input value to an ng-model like so:

<input type="text" ng-model="array">

how do I bind the input text as an array? So if I input one, two, three, the resulting model will be [ "one","two","three ].

Right now this is how I'm achieving this:

<input type="text" ng-model="string" ng-change="convertToArray()">

And in my controller:

$scope.convertToArray = function(){
    $scope.array = $scope.string.split(',');
}

It works fine but I don't think it's best practice because I'm making a $scope.string variable and then hardcoding the destination array.

Is it possible to just have the input's model set into array and then have the input pass through the function before being bound to the scope?

• javascript
• model-view-controller
• angularjs

2 Answers 2

ngList will do exactly what you want.

Text input that converts between comma-separated string into an array of strings.

No. Since your input will be a string from the user, you need to manually convert it to array or any other format.

Similar discussion and other approach is discussed here. probably this might help. (see accepted answer in this)

How do I set the value property in AngularJS' ng-options?