Michael Mauracher
Michael Mauracher

Reputation: 201

AngularJS 1.2.0 Bootstrap UI 0.6.0 (bootstrap3_bis2) Typeahead

I'm trying to pass a promise to the Angular Bootstrap Typeahead, but I'm getting always the fallowing error: TypeError: Cannot read property 'length' of undefined

Factory:

    angular.module('app').factory('geoCoding', ['$http', 'geoUtils', function ($http, geoUtils) {

  var request= function(location){
    return $http.get('http://open.mapquestapi.com/geocoding/v1/address',{params:{location:location}});
  };

  var ret = {};

  ret.locate = function (location) {
    return request(location).then(function (data) {
      if (data  && data.data && data.data.results && data.data.results[0]) {
        var locations = [];
        data.data.results[0].locations.forEach(function (location) {
          locations.push({name: geoUtils.location2String(location), location: location});
        });
        return locations;
      }
    });
  };
  return ret;
}]);

Controller:

$scope.getLocations = function(){
    console.log('scope',$scope.inputLocation);
    return geoCoding.locate($scope.inputLocation);
  }

Template:

        <input type="text" class="form-control oo-focus" placeholder="Search" typeahead="location as location.name for location in getLocations()" typeahead-wait-ms="500" ng-model="inputLocation" />

With the old version Angular Bootstrap-UI 0.5.0 everything was working fine. The problems are with Bootstrap-UI 0.6.0 (bootstrap3_bis2). https://github.com/angular-ui/bootstrap/tree/bootstrap3_bis2

Upvotes: 0

Views: 2099

Answers (2)

Stephan Oudmaijer
Stephan Oudmaijer

Reputation: 791

Angular 1.2.0-rc.3 is out, works ok with that version: http://code.angularjs.org/1.2.0-rc.3/

Upvotes: 2

JakubKnejzlik
JakubKnejzlik

Reputation: 6493

If You are using AngularJS 1.2.0-rc.2 there's problem with promises (changed exposing of promise self reference – or somethink like that:) ). I can't really tell You why, but You can find more info here:

Typehead broken when using promises in Angularjs 1.2.0rc2

For me the wirking solution is with settings the promise.$$v variable. So in your example, the code should be:

$scope.getLocations = function(){
   console.log('scope',$scope.inputLocation);
   var promise = geoCoding.locate($scope.inputLocation);
   promise.$$v = promise;
   return promise;
}

I agree with author(wilsonjackson), that this is hacky! Anyway hope it'll help You.

Upvotes: 2

Related Questions