Valeur par défaut sur un Select2 avec un ng-repeat avec des données provenant d'un appel API

Question

J'ai un select2 angulaire comme suit :

<select ui-select2 id="clientID" name="clientID" ng-model="newTicket.clientstate" ng-required="true">
    <option ng-repeat="item in clients track by item.id" value="{{item.clientID}}|{{item.stateID}}" >{{item.displayName}}</option> 
</select>

dans mon contrôleur, les clients sont définis comme ceci (appelant un service qui renvoie une promesse $ à partir d'une ressource $) :

TicketService.getClients().then(
    function(clients) {
        $scope.clients = clients;
    }
);

J'ai également défini la valeur initiale de $scope.newTicket.clientstate dans le contrôleur.Étant donné que l’appel à $resource est asynchrone, la définition de la valeur initiale a lieu avant la résolution de la requête.

J'essaie de faire en sorte que la liste déroulante remplisse une valeur initiale ("DEMO | DEMO") une fois l'appel API terminé.Je pense que la solution est l'une des 3 choses suivantes :définir ng-init sur la sélection, définir ng-selected sur ng-repeat ou faire quelque chose dans le .then() qui se produit après que l'API a renvoyé la requête.Cependant, je n'arrive pas à faire fonctionner la bonne syntaxe et j'espérais obtenir des conseils sur la façon de procéder.

Mon premier effort pour résoudre les problèmes (vous pouvez le voir dans les commentaires ci-dessous) a été de tout convertir en ng-options, mais la bibliothèque ui-select2 est incompatible avec ng-op[tions, donc je cherche une autre possibilité.

Answer 1

Je viens de tomber sur la même chose et un gars au travail m'a indiqué la bonne direction.

Il s'avère que vous et moi essayions tous les deux de compliquer la solution.Tout ce que tu dois faire est:

TicketService.getClients().then(
    function(clients) {
        $scope.clients = clients;
        // set the default value after the list comes back
        $scope.newTicket.clientstate = 'yourDefaultValue';  
    }
);

Alors vous devriez être prêt à partir !

Assurez-vous simplement que vous avez initialisé $scope.newTicket avant cela, sinon vous obtiendrez une erreur indiquant que vous ne pouvez pas accéder aux propriétés d'un objet non défini.

Et je suppose que getClients() renvoie un $promise objet?Sinon, vous devrez faire soit :

TicketService.getClients(function(clients){...}))

ou:

TicketService.getClients().$promise.then(function(clients){...}))