Angularjs Funktion ruft Reihenfolge

Question

Ich habe eine Dropdown-Liste von Optionen, die abhängig von Bedingungen angezeigt werden oder nicht.

<div class="col-sm-9"> 
     <select class="form-control" ng-model="vm.templateType" ng-disabled="vm.status == 'sold' || vm.status == 'return' "ng-options="type.id as type.name for type in vm.templateTypes | filter:vm.isShowableTemplate"></select> 
</div> 

Hier ist mein Controller:

function FormOrderDialogController(tsModulesService, $scope, $q, $http, $uibModalInstance, params, $filter, Requester)        

    Requester.restGet("/events/" + params.eventId, null, params.serverId).then((data)=>{ 
     vm.event = data; 
    }); 

    Requester.restGet('/dic/10', null, null, null, true).then((resp) => { 
     vm.templateTypes = resp; 
     vm.templateType = vm.templateTypes[0].id; 
    });  

    vm.isShowableTemplate = isShowableTemplate; 

    function isShowableTemplate(templateType) { 

     switch (templateType.id) { 
      case 321: 
       return !!vm.event.info.ticketTemplate; 
      case 322: 
       return !!vm.event.info.ticketETemplate; 
     } 
    }                   

Als isShowableTemplate aufgerufen I -Ereignisobjekts erwarten gefüllt werden, und die Sache ist die GetEvent Funktion wird zweimal aufgerufen, einmal vor isShowableTemplate aufgerufen, und danach. Das Problem ist, dass das Ereignis nach dem ersten Aufruf undefiniert ist und ich einen Fehler bekomme: "Kann die Eigenschaft nicht 'undefiniert" lesen. Meine Frage ist warum ist es so und was ich falsch mache. Ich bin neu sowohl js als auch eckig, also vermisse ich etwas Wesentliches.

Answer 1

Warum entfernen Sie nicht die Funktion und Filter:

function FormOrderDialogController(tsModulesService, $scope, $q, $http, $uibModalInstance, params, $filter, Requester)        

    Requester.restGet("/events/" + params.eventId, null, params.serverId) 
     .then(data => { 
      vm.event = data; 

      return Requester.restGet('/dic/10', null, null, null, true); 
     }) 
     .then(resp => { 
      vm.templateTypes = resp; 
      vm.showableTemplateTypes = resp.filter(t => { 
       switch (t.id) { 
        case 321: 
         return !!vm.event.info.ticketTemplate; 
        case 322: 
         return !!vm.event.info.ticketTemplate; 
       } 

       return false; // or true depending if you want to show the  others. 
      }); 

      vm.templateType = vm.templateTypes[0].id; 
     }); 
} 

ich die beiden Promise kombiniert haben s zusammen, weil Sie die vm.event in der zweiten Reaktion verwendet werden. Auf diese Weise können Sie immer einen Wert für vm.event garantieren.

Die html:

<div class="col-sm-9"> 
    <select class="form-control" ng-model="vm.templateType" ng-disabled="vm.status == 'sold' || vm.status == 'return' "ng-options="type.id as type.name for type in vm.showableTemplateTypes"></select> 
</div>