Как предварительно выбрать опцию по умолчанию в ng-options, используя переменную $ scope - PullRequest
0 голосов
/ 01 сентября 2018

У меня есть <select> в форме с другими полями, например, так-

<form class="formCSS">
  <div class="inputs">
   <label class="labelTag">Name *: &nbsp&nbsp</label>
   <select class="inputTag" ng-model="selectedName" 
           ng-options="n.name for n in adminNames"></select>
  </div>
</form>

adminChannels - массив объектов этой структуры {_id:"....", name:"..."}

Когда я "перехожу" в это состояние, я передаю имя (которое существует и в adminNames) примерно так -

$state.go('schedule',{name:response.name});

Я хочу, чтобы указанное имя (доступное с помощью $scope.name) было предварительно выбрано при загрузке этого шаблона.

Я пробовал что-то вроде этого -
ng-init = "selectedName=adminNames[adminNames.indexOf(name)]"

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

Я просмотрел все остальные сообщения о выборе параметров по умолчанию, но ни в одном из них не содержится информация о предварительном выборе с использованием переменной $ scope.

Пожалуйста, дайте мне знать, если я предоставлю дополнительную информацию / код. Заранее спасибо!

Ответы [ 2 ]

0 голосов
/ 01 сентября 2018

Использование Array.find () :

$scope.selectedName = $scope.adminNames.find( x => (x.name == $scope.name));

Метод find() возвращает значение первого элемента в массиве, которое удовлетворяет предоставленной функции тестирования.


Другой подход заключается в использовании предложения as в директиве ng-options:

<select class="inputTag" ng-model="selectedName" 
        ng-options="n.name as n.name for n in adminNames">
</select>

ДЕМО

angular.module("app",[])
.controller("ctrl",function($scope) {
    $scope.adminNames=[
        {name: "fred"},
        {name: "jane"},
        {name: "sally"},
    ];
    $scope.selectedName="jane";
    $scope.find = function(name) {
         return $scope.adminNames.find( x => (x.name == name)); 
    };
});
<script src="//unpkg.com/angular/angular.js"></script>
<body ng-app="app" ng-controller="ctrl">
    <select class="inputTag" ng-model="selectedName" 
            ng-options="n.name as n.name for n in adminNames">
    </select>
    <br>
    object = {{find(selectedName)}}
</body>

Для получения дополнительной информации см.

0 голосов
/ 01 сентября 2018

Когда я начал поэтапную отладку, я увидел, что adminNames[adminNames.indexOf(name)] было "неопределено".

Так что вместо этого я сделал это в контроллере, чтобы найти индекс полученного $ scope.name -

var index = $scope.adminNames.map(function(e) { return e.name; }).indexOf($scope.name);

$scope.selectedName = $scope.adminNames[index];

Этот ТАК вопрос / ответ помог мне понять это.

...