typeahead angular ui - 无法读取未定义的属性“长度”

我正在为我的应用程序使用Angular-ui Bootstrap。我使用typeahead指令。typeahead angular ui - 无法读取未定义的属性“长度”

HTML：

<input type="text" class="pass_code_input" ng-model="SuppPrefix" Typeahead="ddl_item.Text for ddl_item in getData($viewValue)"/>

控制器

function AutoCompleteCtrl($scope,$http, AutoCompleteSrv) { 
    $scope.getData = function (prefix) { 
     AutoCompleteSrv.GetAutoComplete("Supplier", prefix).then(function (result) { 
      var results_arr = []; 
      angular.forEach(result.data, function (item) { 
       results_arr.push({ "Val": item.Val, "Text": item.Text }); 
      }); 
      return results_arr 
     }); 
    }; 
};

服务：

function AutoCompleteSrv($http) { 
    var _$http = $http; 
    self = this; 
    self.GetAutoComplete = function (DataType, Prefix) { 
     var promise = _$http({ 
      method: "GET", 
      url: 'api/AutoComplete', 
      params: { 'DataType': DataType, 'Prefix': Prefix } 
     }).success(function (data, status, headers, config) { 

     }).error(function (data, status, headers, config) { 

     }); 
     return promise; 
    }; 
};

我收到从数据服务器，但我无法在屏幕上显示它。当我在Chrome浏览器开发工具来运行调试器，我得到了一个错误：

TypeError: Cannot read property 'length' of undefined 
at http://localhost:52145/js/libs/ui-bootstrap-tpls-0.11.0.min.js:13:12650 
at m.promise.then.u (http://localhost:52145/js/angular/angular.min.js:97:280) 
at m.promise.then.u (http://localhost:52145/js/angular/angular.min.js:97:280) 
at http://localhost:52145/js/angular/angular.min.js:98:417 
at h.$eval (http://localhost:52145/js/angular/angular.min.js:108:482) 
at h.$digest (http://localhost:52145/js/angular/angular.min.js:106:62) 
at h.$apply (http://localhost:52145/js/angular/angular.min.js:109:287) 
at HTMLInputElement.l (http://localhost:52145/js/angular/angular.min.js:133:191) 
at http://localhost:52145/js/angular/angular.min.js:31:32 
at q (http://localhost:52145/js/angular/angular.min.js:7:386)

我搜索了在多个地方的解决方案，如that，也跟着一步一步的引导用户界面主页上的说明进行操作。我做错了什么？

来源

2014-07-06 Lichte

你没有成功返回数据的方法，但期望它在你的控制器 – harishr

我试过了，它没有帮助。另外，当我调试时，我看到控制器中的数据（它带有承诺）。数据甚至从控制器返回，但然后我得到这个错误。 – Lichte

你可以请安装一个笨重的，会给你快速解决 – harishr

我刚碰到这个，就解决了它。这里的关键是，在角度网站上给出的例子中，他们“返回”$ http结果。这让人感到困惑，但最终这是重要的回报。所以在你的情况下，你正在为该返回值设置一个变量，所以返回永远不会返回。当你的代码以这种方式格式化时，你需要做两件事来改变它：第一个是“return”语句位置错误。第二个是返回值声明也在错误的地方。下面是示例中的非工作代码：

..... 
then(function(res){ 
     var addresses = []; 
     angular.forEach(res.data.results, function(item){ 
     addresses.push(item.formatted_address); 
     }); 
     return addresses; 
    });

下面是我如何改变它以使其工作。

var addresses = [] 
.... 
then(function(res){ 
     angular.forEach(res.data.results, function(item){ 
     addresses.push(item.formatted_address); 
     }); 
    }); 
    return addresses;

如果您不使用“then”，而是使用“success”和“error”函数，这会变得更加清晰。然后，很明显返回声明应该在哪里以及返回值声明应该在哪里。以这种方式编写代码并使其运行正是我如何找出问题所在。请注意，您应该清除“then”函数中的地址值，否则它将继续追加越来越多的值。

来源

2014-07-09 00:09:57 Scott

获取相同的错误 - 现在已经持续了好几个小时。上面的建议不为我工作.. – Greg

这救了我。谢谢。 – Aravind

也救我了！ bleh关于承诺回报的良好经验法则。（超级承诺）。 –

在您的服务中，您应该在回调函数.success()方法中返回数据。

来源

2014-07-06 12:10:36

我试过，但它没有帮助。另外，当我调试时，我看到控制器中的数据（它带有承诺）。数据甚至从控制器返回，但然后我得到这个错误。 – Lichte

我也看到了正在返回的对象的集合。而且我仍然遇到错误。 – Stephane

我也有这个问题。

对我来说，我让我的控制器调用我的服务，然后与api交谈来获取我的数据。

即使获取数据的工作（我能看到带的console.log）被显示在网页上没有从中选择，而我得到的

cannot read property length of undefined

错误。

最后我意识到我需要将我的呼叫返回给服务。

//controller with code NOT working 
vm.getData = function(val, ep) { 

    myService.getData(val, ep) 
    .then(function(data){ 
    return data 
    }); 
}; 

//service 

this.getData = function(val, ep) { 
    return $http({ 
    //do http call here 
    }) 
    .then(function(data) { 
     //do what's needed with the data here 
     return data 
    }); 
};

认为得到这个工作的修复：

//controller with code WORKING 
vm.getData = function(val, ep) { 

return myService.getData(val, ep) 
    .then(function(data){ 
    return data 
    }); 
};

所以，再一次，我只需要我的电话返回到该服务，然后将预输入和预期一样，并没有更多的错误！

来源

2015-05-19 22:47:16 jsuser

谢谢，帮助我。 – vanzylv

typeahead angular ui - 无法读取未定义的属性“长度”

回答

相关问题