удалить первый пустой элемент из выпадающего списка и заменить его текстом выбора по умолчанию

Question

В моем проекте есть много выпадающих списков. Элементы этого выпадающего списка загружаются из базы данных, используя сервис API. Таким образом, всякий раз, когда он загружается, эта пустая опция появляется в первую очередь. Как удалить этот первый пустой параметр и заменить его выделением текста по умолчанию.

Контроллер

$scope.EnclosureModel = "";

loadEnclosure();
function loadEnclosure()
{
    $scope.loading = true;
    var promise = ngservice.getClosureType();
    promise.then(function (resp) {
        $scope.EnclosureList = resp.data;
        $scope.loading = false;
    });
}

вызовы API потребляют по угловому методу обслуживания

обслуживание

this.getClosureType = function () {
    var res = $http.get("/api/Surge/GetEnclosure");
    return res;
};

Вот мой взгляд:

Enclosure type 
<a href="#" onclick="return false;" rel="EnclosureType">
    <img src="img/question.jpg" Border="0" style="vertical-align:middle; width:16px;" />
</a>

<br />

<select ID="Drp_EnclosureType_Option1" AutoPostBack="True" Class="form-control form-control-small" ng-model="EnclosureModel" ng-options="p for p in EnclosureList" ng-change="getConf();getNoCurr();getMaxCur();getMScr();getLoc();getIec();getmCOV();getsysV();getIncidents();getRemSignals();getalr();getRejc();getCount();">
    <option Value ="" selected="selected">--Select--</option>
</select>

Элементы загружаются должным образом из базы данных, но каждый раз, когда эта пустая опция включается первой. После проверки такого количества сообщений я перепробовал много вещей. Последний, который я попробовал

$ scope.EnclosureModel = {"selected": null}

Он полностью удалил первый пробел, но проблема в том, что другие выпадающие списки будут меняться в зависимости от выбора элемента этого раскрывающегося списка "ENCLOSURE". Поэтому, когда бы я ни пытался описать выше, другие выпадающие списки меняются и имеют нулевые элементы.

Я знаю, что угловая модель ведет себя так из-за неопределенного значения, когда ни один элемент не выбран.

Но как убрать первый пробел из опции, когда данные загружаются службой API.

Answer 1

Я столкнулся с подобной проблемой при заполнении выпадающих списков в angularjs. Решение, которое я придумал, заключалось в том, чтобы в качестве описания отключить первую опцию в поле выбора (см. Фрагмент кода ниже):

<div class="row">
    <div class="col-sm-6 col-md-5 col-lg-3">
        <label>Incident Type:</label>
        <select id="incidentTypeDropdown" class="select-style select-style-required" ng-model="causeData.incidentType" ng-change="incidentTypeOnChange(causeData.incidentType)">
            <option value="" disabled selected>Select Incident Type...</option>
            <option ng-repeat="incident in incidentTypeList" value="{{incident.incidentTypeID}}">
                {{incident.type}}
            </option>
        </select>
    </div>
</div>

Соответствующая часть этого фрагмента кода, которая может вам помочь, - это первая строка опции:

<option value="" disabled selected>Select Incident Type...</option>

Таким образом, эта опция всегда отключена и служит для пользователя описанием действия, которое бы я хотел, чтобы он сделал, «Выбор типа инцидента ...», а затем это результат на веб-странице:

Я надеюсь, что этот подход разрешит вашу проблему.