Editable array of strings within ui-grid

I am trying to display a list of Strings (array) in a ui-grid table and allow the user to create new entries in the list.

In the first item added, everything works fine (the item is added and the user can update it). After this, for every item added, the changes did previously are being lost.

Link to reproduce the issue (with steps to reproduce): http://plnkr.co/edit/d3b8IYGVM6sMaALN

Am I missing something? Do some of you have a clue about how to solve it?

Thank you in advance!

Code:

$scope.gridOptions = {
        enableSorting: true,
        enableGridMenu: true,
        gridMenuCustomItems: [
            {
                title: 'Add',
                action: function ($event) {
                    $scope.gridOptions.data.push("New item");
                },
                order: 210
            }
        ],
        columnDefs: [
          { name:'Name', field: uiGridConstants.ENTITY_BINDING }
        ],
        data : [
          "John Rogers",
          "David Michaels",
          "Andrew Johnson",
          "Donald McDonald"
        ]
      };
}]);

Solution

I forked your plnkr and here is an example: http://plnkr.co/edit/qqEon3rtEjf6RDx3

The problem is associated with the type of data, so, my recommendation is to use an object. If you use a list of objects instead of a list of strings, you won't have this issue.

What I did was:

var app = angular.module('app', ['ngTouch', 'ui.grid', 'ui.grid.edit']);

app.controller('OneDimensionCtrl', ['$scope', 'uiGridConstants', function ($scope, uiGridConstants) {
$scope.data = [
          {name: "John Rogers"},
          {name: "David Michaels"},
          {name: "Andrew Johnson"},
          {name: "Donald McDonald"}
        ]
$scope.gridOptions = {
        enableSorting: true,
        enableGridMenu: true,
        gridMenuCustomItems: [
            {
                title: 'Add',
                action: function ($event) {
                    $scope.gridOptions.data.push({name: "New item"});
                },
                order: 210
            }
        ],
        columnDefs: [
          { name:'name' }
        ],
        data : $scope.data
      };
}]);

If your original data comes as a list of string, you can create on object with:

$scope.data.map(function (originalValue) {
  return ({ name: originalValue })
})