AngularJS : TypeError: Object #<Object> has no method 'replace'

Question

Here's my problem :

I use Angular and I try to implement ngTagsInput directive ( http://mbenford.github.io/ngTagsInput/ ). The problem I'm facing is try to retrieve results from a service, with this controller :

dashboardApp.controller('TagsCtrl', function($scope, $http) {
      $scope.tags = [];
      $scope.loadTags = function(query) {
        $scope.results = $http.get( '/search/autocomplete?q=' + query); // also tried with $http(); same thing
        return $scope.results;
        console.log($scope.results);
      };
    });

In the view, the autocomplete "kinda works" , it provides a droplist with a lot of [Object Object]. So I guess I'm pretty close, but the console throw this error ( console.log($scope.results);) :

TypeError: Object #<Object> has no method 'replace'

The HTML part, if you need it :

 <div class="modal-body" id="ng-tags-input-container" ng-controller="TagsCtrl">
                                <tags-input ng-model="tags">
                                  <auto-complete source="loadTags($query)"></auto-complete>
                                </tags-input>
                              </div>

I hope someone can help, this is driving me crazy.

Answer 1

I had a talk with Michael Benford, creator of ngTagsInput, and he said ngTagsInput can only work with simple arrays like : ['item', 'item', 'item'];

In my case, I got 2 solutions :

• making another service that return only the strings I need as an array
• I can convert my big json as a simple array with JS

Hope it will help someone :)