2016-08-05 2 views
0

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

Параметры select заполняются правильно, как показано ниже.

populated options

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

Я проиллюстрировал это ниже:

индекс 0 от нагрузки Index is 0

индекс 1 на нагрузке Index is 1

Что я делаю неправильно?

HTML

<select name="ipSelect" data-ng-model="selectedOption"> 
    <option ng-repeat="ip in adapters track by $index" data-ng-value="adapters.indexOf(ip)">{{ip}}</option> 
</select> 

В контроллере

ipcRenderer.on('device_ips_loaded', (event, adapters) => { 
    let storedIndex = localStorage.getItem('defaultIp') || 0 
    console.log('Adapters: ' + adapters) 
    console.log('storedIndex: ' + storedIndex) 
    $scope.adapters = adapters 
    $scope.$apply(function() { 
     $scope.selectedOption = adapters[storedIndex] 
    }) 
    console.log('selectedOption: ' + $scope.selectedOption) 
}) 

ответ

1

Я рекомендую вам использовать ngOptions.

Посмотреть работает:

(function() { 
 
    'use strict'; 
 

 
    angular 
 
    .module('app', []) 
 
    .controller('MainCtrl', MainCtrl); 
 

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

 
    function MainCtrl($scope) { 
 
    $scope.selectedOption = '1'; 
 
    $scope.adapters = ['25.91.79.201', '192.168.0.14'] 
 
    } 
 
})();
<!DOCTYPE html> 
 
<html ng-app="app"> 
 

 
<head> 
 
    <script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.5.8/angular.min.js"></script> 
 
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.6/css/bootstrap.min.css"> 
 
</head> 
 

 
<body ng-controller="MainCtrl"> 
 
    <div class="col-md-12"> 
 
    <select class="form-control" ng-options="key as ip for (key, ip) in adapters" ng-model="selectedOption"> 
 
     <option value label="Select an adapter" hidden></option> 
 
    </select> 
 
    <pre ng-bind="selectedOption"></pre> 
 
    </div> 
 
</body> 
 

 
</html>