【问题标题】:Angularjs Multiple Select: Cannot read property 'length' of undefinedAngularjs多选:无法读取未定义的属性“长度”
【发布时间】:2018-06-12 06:07:22
【问题描述】:

我尝试了很多变化,但似乎没有任何效果。

我收到以下错误:

TypeError: Cannot read property 'length' of undefined
at select.js:1560
at m.$broadcast (angular.js:18487)
at Object.ctrl.select (select.js:673)
at fn (eval at compile (angular.js:15358), <anonymous>:4:453)
at e (angular.js:26994)
at b.$eval (angular.js:18161)
at b.$apply (angular.js:18261)
at HTMLDivElement.<anonymous> (angular.js:26999)
at HTMLDivElement.dispatch (jquery-3.2.1.min.js:3)
at HTMLDivElement.q.handle (jquery-3.2.1.min.js:3)

我在 HTML 部分的代码是:

<label for="addRecipient" class="bold">Additional Recipients:</label>
<ui-select multiple ng-model="addRecipient.selection" theme="bootstrap" title="Choose Recipients" class="multipleSelect">
<ui-select-match placeholder="Select Additional Recipients...">{{$item.name}}</ui-select-match>
<ui-select-choices repeat="additional in addRecipients | filter:$select.search">
 {{additional.name}}
</ui-select-choices>
</ui-select>

在我的控制器中:

$scope.addRecipient = {}; 
$scope.addRecipients =  [];
$.each(success.data.d.results, function (ind, val) {
  $scope.addRecipients.push({'name': val.Title, 'email':val.Email});
}); 

我可以在我的选择中看到要选择的选项,但是每次单击任何选项时,都会出现该错误。这是显示来自 success.data.d.results 信息的下拉列表:

【问题讨论】:

  • 这意味着你的数组是空的
  • 这不是您的完整控制器,我的假设是 success.data.d.results 是空的,因此您的 $.each 没有迭代
  • 拜托,你能分享控制器,指令等吗?
  • 数组有值。我在下拉列表中得到结果。我将在我的帖子中添加一张图片。
  • 现在一切正常。我很高兴我们找到了解决此类问题的方法。

标签: javascript angularjs select multiple-select


【解决方案1】:

你应该初始化你的选择数组,

$scope.addRecipient = {}; 
$scope.addRecipient.selection = [];

【讨论】:

  • 谢谢!感谢您的回答,我能够弄清楚。把 $scope.addRecipient = {};但是当我将其更改为数组时,它起作用了。当我尝试时,您的解决方案不起作用,但这正是导致我让它工作的原因。谢谢!
  • 很高兴能帮上忙。
  • 我很感激!我快疯了。
【解决方案2】:

这就是我的代码现在的样子并且它正在工作。谢谢@NTP 的提示!

<label for="addRecipient" class="bold">Additional Recipients:</label>
<ui-select multiple ng-model="addRecipient.selected" theme="bootstrap" title="Choose Recipients" class="multipleSelect">
   <ui-select-match placeholder="Select Additional Recipients...">{{$item.Title}}</ui-select-match>
   <ui-select-choices repeat="additional in addRecipients | filter:$select.search">
       {{additional.Title}}
</ui-select-choices>

在控制器中:

$scope.addRecipient = {}; 
$scope.addRecipients = [];

下拉值:

$scope.addRecipients = success.data.d.results;

获取选定的值:

//add Recipient
var addRecipients;
if ($scope.addRecipient.selected && $scope.addRecipient.selected !='undefined'){
     things = [];
     console.log($scope.addRecipient.selected);
     for (var key in $scope.addRecipient.selected) {
          if (key < $scope.addRecipient.selected.length) {
                 things.push($scope.addRecipient.selected[key].Email) ;
          }
      }
      addRecipients = things;
 }

【讨论】:

    【解决方案3】:

    当下拉列表中的数据为空时,我收到错误消息。在下拉列表中初始化值后,它就可以正常工作。 this.dropdownList=[];

    【讨论】:

      猜你喜欢
      • 1970-01-01
      • 1970-01-01
      • 2011-11-01
      • 1970-01-01
      • 1970-01-01
      • 2015-08-10
      • 2020-09-14
      • 2018-01-11
      • 2020-12-23
      相关资源
      最近更新 更多