2014-10-11 1 views
0



Я просмотрел «вопросы, которые могут иметь ваш ответ», без везения. ничего не работает для меня :(

Хотя мне кажется, что у меня есть очень простой случай, что-то пошло не так ...

У меня есть следующий HTML:Невозможно установить начальное значение при использовании ng-опций

<body> 
    <div ng-controller="eventController as eventCtrl"> 
    <select ng-init="eventCtrl.userDetails.station = eventCtrl.eventDetails.stations[0]" ng-model="eventCtrl.userDetails.station" ng-options="o as o for o in eventCtrl.eventDetails.stations"></select> 
    </div> 
</body> 

И мои угловатые приложение выглядит как это:

(function() { 
var app = angular.module('eventRegistration', []); 
var conn = new dataConn(); 

app.controller('eventController', ['dataService', function(dataService) { 
    var eventCtrl = this; 
    eventCtrl.eventDetails = {}; 
    eventCtrl.userDetails = {}; 


    dataService.getActiveEvents() 
     .then(function (events) { 
      eventCtrl.eventDetails = events[0]; 
     });   
}]); 

app.service('dataService',['$q', function($q) { 
    return { 
     getActiveEvents: function() { 
      var deferred = $q.defer(); 
      conn.getActiveEvents(function(events) { 
       deferred.resolve(events) 
      }); 
      return deferred.promise; 
     } 
    } 
}]); 
})(); 

Мой eventCtrl.eventDetails объект будет, наконец, выглядит следующим образом (я получаю массив из тех, с сервера и теперь использует только первый один):

{ 
     "date":new Date(2014, 10, 2), 
     "isActive": true,    
     "stations":['STATION_A', 'STATION_B'],       
     "comments":"" 
    } 

Я пытаюсь установить модель выбранного пользователя станции eventCtrl.userDetails.station и инициировать его значение на первую станцию ​​eventCtrl.eventDetails.stations с использованием нг-Init.

Важно отметить, что данные станций (на самом деле все данные о событиях) извлекаются async (с использованием отложенного объекта).

Результатом моего кода является поле выбора со значениями «STATION_1» и «STATION_B», но у меня есть дополнительное первое пустое значение. кажется, что что-то не так в моем определении ng-init.
Любые идеи?


Большое спасибо!

+0

Используйте 'ng-selected' для инициализации значения для выбора. https://docs.angularjs.org/api/ng/directive/ngSelected –

ответ

0
**ng-selected** will fit your need. 
After making an async call to the server, assign the value which you want to initialize to a scope variable and use that variable in ng-selected. 

`<select ng-if="selecteditem" ng-model="selecteditem" ng-options="item for item in items.name" ng-selected="selecteditem"> 
    </select>` 

Here selecteditem is the variable which you want to initialize. 

`myapp.controller('ItemCtrl',['$scope','$http', function($scope,$http) //No I18N 
{ 
    $scope.items = {"name":['first','second']} 
    $scope.selecteditem = $scope.items.name[0] 
}]);` 


Since you mentioned an async call use **ng-if** such that select will be displayed only it has data.You can display some default values using **ng-if="!selecteditem"** 

see the plnkr http://plnkr.co/edit/hv2OI1If1FMGhV0dgj9a?p=preview 
+0

Собственно, свойство ng-if разрешило мой случай (без выбора ng). Благодаря! – user1027133