javascript - $scope.scheduler は AngularJS では定義されていません

Question

私は AngularJS v1.4.1 と DayPilot v8.1.17 を使ってこのチュートリアルを作成しています。

正常に動作していますが、イベントを json 形式で返す外部サーバーからすべてのイベントをロードするときに問題が発生します。

view.html

<div ng-controller="ViewSchedulerDPCtrl" >
  <daypilot-scheduler id="scheduler" daypilot-config="schedulerConfig" daypilot-events="events" ></daypilot-scheduler>
</div>

スケジューラDP.js

'use strict';

    var app = angular.module('ModuleApp')
    app.controller('ViewSchedulerDPCtrl', function($scope, $timeout, aircraftService,flightService) {
        $scope.schedulerConfig = {
          scale: "Hour",
          days: 5,
          startDate: new Date(),
          timeHeaders: [
              { groupBy: "Month"},
              { groupBy: "Day", format: "d" },
              { groupBy: "Hour", format: "hh:mm" }
          ]
        };

        $timeout(function() {
          loadResources();
          loadEvents($scope.scheduler.visibleStart(), $scope.scheduler.visibleEnd()); // this line doesn't work, scheduler got undefined
        });

        var loadResources=function() {

          aircraftService.getAllAircrafts().then(function(aircrafts){
            $scope.schedulerConfig.resources = aircrafts;

          });
        }

        function loadEvents(from, to) {
          flightService.getFlights(from,to).then(function(flights){
             $scope.schedulerConfig.startDate = from;
              $scope.schedulerConfig.days = Math.floor(new DayPilot.TimeSpan(to.getTime() - from.getTime()).totalDays());
              $scope.events = flights;
          });
        }
      });

スケジューラはリソースを正しくロードしますが、イベントは表示されません。Chrome コンソール ログを見ると、次のエラーが表示されます。

エラーが発生する行にブレークポイントを入れると、空のように見えます:

私が間違っていることを誰かが知っていますか？