AngularJS Built-in directives ngList


The ng-list directive is used to convert a delimited string from a text input to an array of strings or vice versa.

The ng-list directive uses a default delimiter of ", " (comma space).

You can set the delimiter manually by assigning ng-list a delimeter like this ng-list="; ".

In this case the delimiter is set to a semi colon followed by a space.

By default ng-list has an attribute ng-trim which is set to true. ng-trim when false, will respect white space in your delimiter. By default, ng-list does not take white space into account unless you set ng-trim="false".


angular.module('test', [])
  .controller('ngListExample', ['$scope', function($scope) {
    $scope.list = ['angular', 'is', 'cool!'];

A customer delimiter is set to be ;. And the model of the input box is set to the array that was created on the scope.

  <body ng-app="test" ng-controller="ngListExample">
    <input ng-model="list" ng-list="; " ng-trim="false">

The input box will display with the content: angular; is; cool!