Как выбрать опцию в ngOptions с помощью третьего параметра, присутствующего в объекте опции? - PullRequest
Новая
       31

Как выбрать опцию в ngOptions с помощью третьего параметра, присутствующего в объекте опции?

0 голосов
/ 01 февраля 2019

У меня есть массив опций для выпадающего списка, например 

[
    {key:1,value'foo',selected:true},
    {key:2,value'foo2',selected:false}
]

Я хочу выбрать значение опции со свойством true в моей модели.Поэтому для этой опции массив моей модели должен быть инициализирован и привязан к 1.

Любая помощь приветствуется !!Заранее спасибо :)

Для этого я знаю, что могу сделать это, включив контроллер и установив значение, свойство которого выбрано как true.Я ищу альтернативу, которая лучше.Также я попробовал ng-repeat на опциях, и это работает, но я думаю, что ngOptions лучше с точки зрения производительности.

1 Ответ

0 голосов
/ 01 февраля 2019

Если я правильно понял требования: 

angular.module('selectExample', [])
  .controller('ExampleController', ExampleController);

ExampleController.$inject = ['$scope'];

function ExampleController($scope) {
  $scope.selectOptions = [{
      key: 1,
      value: 'foo',
      selected: true
    },
    {
      key: 2,
      value: 'foo2',
      selected: false
    }
  ];
  
  $scope.filterOptions = filterOptions;
  
  setFirstOptions($scope, 'selected', $scope.selectOptions);
}

function filterOptions(data) {
  return data.filter(function(item) {
    return item.selected;
  });
}

function setFirstOptions($scope, variable, data) {
  var filteredOptions = filterOptions(data);
  if (filteredOptions.length > 0) {
    $scope[variable] = filteredOptions[0];
  }
}

angular.bootstrap(
  document.querySelector('body'), ['selectExample']
);
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.7.5/angular.min.js"></script>
<div ng-controller="ExampleController">
  <select ng-model="selected" ng-options="option.value for option in filterOptions(selectOptions)">
</div>
...