使用AngularJS将选定值绑定到Multi Select ListboxFor控件

Question

我在下面的情景中遇到问题，任何人都可以指导我。

方案： 从已经用户输入的DB中获取逗号分隔的ID，然后拆分值，然后在编辑模式下将值绑定到多选列表框控件中。

我尝试了以下代码来实现它，但它不适用于我。

@Html.ListBoxFor(c => c.ClientDemographicHospitalId, new MultiSelectList(Model.Hospitals, "Value", "Text"), new { ng_model = "hospitalDropdownList", @class = "HospitalListbox", style = "width:65%" })

var lstSelectedIDs = employee.ClientDemographicHospitalId;
var arySelectedID = lstSelectedIDs.split(",");

for (var i = 0; i <= arySelectedID.length; i++) {
    $scope.hospitalDropdownList.append($('<option></option>').val(arySelectedID[i].Value).html(arySelectedID[i].Text));
}

附上截图。

代码：

控制：

Answer 1

鉴于您的输入格式为1,2,3,4,5，您可以拆分输入并使用ng-options指令填充<options>的{​​{1}}。请注意，您选择的选项会转到<select>，selectedOption需要ng-model。

作为旁注：不要永远将AngularJS与jQuery混合使用。我听说过ng-options在jQuery和AngularJS之间混淆的情况。没有jQuery，一切都可以在AngularJS中完成。 （如下所示）

$

var app = angular.module("MyModule", []);

var MyController = function($scope) {
  $scope.text = "";
  $scope.selectedOption;

  $scope.populateDropDown = function() {
    $scope.allIds = $scope.text.split(",");
  }
}
app.controller(MyController, "[$scope, MyController]");