下拉列表未绑定到Angular中的ng-model

时间:2016-07-25 10:31:17

标签: javascript angularjs

我缺少一些非常基本的东西,但我无法理解。我在视图中有三个字段,其中两个是下拉列表。

    <div class="form-group row">
        <label for="GroupName" class="col-sm-4 form-control-label">Group Name : </label>
        <div class="col-sm-8">
            <input ng-model="referenceEdit.groupName" id="GroupName" class="form-control" type="text">
        </div>
    </div>
    <div class="form-group row">
        <label for="GroupType" class="col-sm-4 form-control-label">Group Type : </label>
        <div class="col-sm-8">
            <select name="selGroupType" id="selGroupType" class="form-control" ng-change="referenceEdit.populateGroupTypeDetails(selGroupType)" ng-options="groupType.value for groupType in referenceEdit.groupTypes track by groupType.id" ng-model="referenceEdit.groupType"></select>
        </div>
    </div>
    <div class="form-group row">
        <label for="GroupAssignmentMethod" class="col-sm-4 form-control-label">Group Assignment Method : </label>
        <div class="col-sm-8">
            <select name="selGroupAssignmentMethod" id="selGroupAssignmentMethod" class="form-control" ng-options="assignmentMethod.id for assignmentMethod in referenceEdit.assignmentMethods track by assignmentMethod.value" ng-model="referenceEdit.assignmentMethod"></select>
        </div>
    </div>

现在在控制器中,我以这种方式获得这些下拉的结果:

var row_details = GroupMembershipReferenceServices.getReferenceDataRow();

referenceDataDropDownService.getDropDown(REFERENCE_DATA_CONSTANTS.GROUP_TYPE).success(function (result) {
    $scope.referenceEdit.groupTypes = result;
    $scope.referenceEdit.groupype = row_details.grp_typ;
}).error(function (result) {
    alert("Unable to retrieve dropdown values");
});

referenceDataDropDownService.getDropDown(REFERENCE_DATA_CONSTANTS.GROUP_ASSIGNMENT_METHOD).success(function (result) {
    $scope.referenceEdit.assignmentMethods = result;
    $scope.referenceEdit.assignmentMethod = row_details.grp_assgnmnt_mthd;
}).error(function (result) {
    alert("Unable to retrieve dropdown values");
});

问题是值正在填充,例如

enter image description here

我们正在相应地显示这些值。结果就像

[0] {id:"1",value:"Chapter Non-Event"}
[1] {id:"2",value:"NHQ Campaign"}

row_details.grp_typ"NHQ Campaign"

即使我指定它,也不会相应地选择下拉选项。

我是否只将它分配给value属性?我错过了什么?

1 个答案:

答案 0 :(得分:0)

使用ng-repeat代替ng-options

例如:

&#13;
&#13;
<select name="selGroupType" id="selGroupType" class="form-control" ng-change="referenceEdit.populateGroupTypeDetails(selGroupType)"  ng-model="referenceEdit.groupType">
<option value="-1">---</option>
<option  ng-repeat="groupType.value for groupType in referenceEdit.groupTypes track by groupType.id" value="{[{groupType.id}]}"> {[{groupType.value}]} </option></select>
&#13;
&#13;
&#13;