使用角度js不会填充下拉值

时间:2017-02-28 12:42:03

标签: javascript angularjs

我有一个我想要编辑的用户对象,在点击编辑按钮时,很少有表格的值被加载,但是没有填充三个值。我从服务中检查了我得到的数据,但它没有填充。

HTML           

    <div class="col-xs-4 col-sm-4 col-md-3 col-lg-3 label-right">
        <label class="control-label">{{::'label.country'|translate}}</label>
        <label class="asterisk">*</label>
    </div>
    <div class="col-xs-8 col-sm-8 col-md-9 col-lg-9 controls">
        <select id="selectCountry" name="selectCountry" required ui-select2="select2CountrySettings" ng-model="selectedUser.country">
            <option ng-repeat="country in countryList" value="{{country.name}}" ng-selected="{{country.name == selectedUser.country}}">{{country.name}}</option>
        </select>
        <span class="help-block" ng-show="editUserForm.selectCountry.$dirty && editUserForm.selectCountry.$error.required">{{::'error.required'|translate}}</span>
    </div>
</div>

<!-- Locale -->
<div class="row control-group" ng-class="{error:editUserForm.selectLocale.$dirty && !editUserForm.selectLocale.$valid, success:editUserForm.selectLocale.$valid}">

    <div class="col-xs-4 col-sm-4 col-md-3 col-lg-3 label-right">
        <label class="control-label">{{::'label.user.locale'|translate}}</label>
        <label class="asterisk">*</label>
    </div>
    <div class="col-xs-7 col-sm-7 col-md-9 col-lg-9 controls">
        <select id="selectLocale" name="selectLocale" required class="locale-select" ui-select2="select2LocaleSettings" ng-model="selectedUser.culture">
            <option ng-repeat="locale in localeList" value="{{locale.name}}" ng-selected="{{locale.name == selectedUser.culture}}">{{locale.name}}</option>
        </select>
        <span class="help-block" ng-show="editUserForm.selectLocale.$dirty && editUserForm.selectLocale.$error.required">{{::'error.required'|translate}}</span>
    </div>
</div>

的Javascript

function reloadUser() {
    loadingDataBegin();

    userDetails.getUserById(userDetails.getSelectedUser().id).then(function (response) {
        $scope.selectedUser = response.results;
    }, function (error) {
        if (error.status !== undefined && (error.status === 401 || error.status === 403)) {
            $rootScope.authentication.reAuthenticate();
        } else {
            toasty.generalError();
        }
    });
}

$scope.selectedUser中,我从服务中获取所有值。上下三个下拉列表区域设置,国家/地区和组织未在下拉列表中填充(image)

1 个答案:

答案 0 :(得分:0)

  1. 使用ng-options,它会在选择框中显示您选择的项目
  2. 如何使用

    ng-options="item.id as item.name for item in names"
    
    1. 使用ng-if将值分配给相应的模型