角度サービスへの非同期呼び出しが完了した後にコントローラをコールします。

Question

私はcustom cell templateとcell modifierの角型ブートストラップカレンダーを使用しています。私のコントローラでは、修飾子関数が呼び出される前にcellModifier関数で使用されるサービスからいくつかの設定データを取得する必要があります。

(function() { 
    angular.module('formioAppBasic') 
    .controller('calendarController', function($scope, moment, calendarConfig, $http, Formio, shiftService, AppConfig) { 

    var vm = this; 

    calendarConfig.templates.calendarMonthCell = 'views/calendar/dayTemplate.html'; 
    calendarConfig.dateFormatter = 'moment'; 

    vm.events = []; 
    vm.calendarView = 'month'; 
    vm.viewDate = moment().startOf('month').toDate(); 
    vm.appConfig = AppConfig; 
    vm.currentUser = Formio.getUser(); 
    // Get station config. 
    shiftService.getStationConfig().then(function(data) { 
     vm.configSlots = data; 
    }); 

    shiftService.getShiftsMonth(token, startDate, endDate) 
     .then(onShifts, onError); 

    var onShifts = function(data) { 
     vm.events = data; 
    }; 

    var onError = function(error) { 
     vm.error = 'There was an error.'; 
    }; 

    var startDate = moment(this.viewDate).toISOString(); 
    var endDate = moment(this.viewDate).endOf('month').toISOString(); 

    var endpoint = APP_URL + '/shift/submission'; 
    var token = Formio.getToken(); 

    vm.cellModifier = function(cell) { 
     // Do work to create the data in the custom cell. 
    }; 

    $scope.$on('$destroy', function() { 
     calendarConfig.templates.calendarMonthCell = 'mwl/calendarMonthCell.html'; 
    }); 
    }); 
})(); 

使用する必要がある設定データは、shiftServiceサービスへの2回の呼び出しから返され、その部分はうまくいきます。 docsに示すように、セル修飾子関数はmwl-calendar指示文から呼び出されます。

<h1>Shift Calendar</h1> 

<h2 class="text-center">{{ calendarTitle }}</h2> 

<ng-include src="'views/calendar/calendarControls.html'"></ng-include> 

<mwl-calendar 
    view="vm.calendarView" 
    view-date="vm.viewDate" 
    events="vm.events" 
    view-title="calendarTitle" 
    cell-is-open="true" 
    cell-modifier="vm.cellModifier(calendarCell)" 
> 
</mwl-calendar> 

それがあるように私は私のコードを実行するとshiftService.getStationConfigとshiftService.getShiftsMonthへの呼び出しが返される前に、cellModifierが呼び出されます。

コントローラ外からcellModifierが呼び出されたことを考慮して、shiftModeの他の2つの呼び出しによってデータが返されるまでcellModifierが呼び出されないようにコードを構造化する方法はありますか？

ありがとうございました。

Answer 1

cellModifierが外部から呼び出された場合は、呼び出される時点を明示的に制御することはできません。しかし、良いニュースは、あなたが実際にそのコントロールを持つ必要はないということです。これらの2つの内部コールが終了するまで、あなたのものをやめることを延期するだけです。これは簡単です。

var promise1 = shiftService.getStationConfig(); 
promise1.then(function(data) { 
    vm.configSlots = data; 
}); 

var promise2 = shiftService.getShiftsMonth(token, startDate, endDate); 
promise2.then(onShifts, onError); 

vm.cellModifier = function(cell) { 
    $q.all([promise1, promise2]).then(function() { 
     // do your stuff here 
    }); 
}; 

必要なのは、$ qサービスをコントローラに挿入することだけです。