如何使用"控制器为"语法获取AngularJS ui-calendar的日历对象？

Question

我正在使用angular-ui的ui-calendar.它非常好用且易于使用.

但是,我无法获取日历对象来调用fullCalendar()和执行日历上的某些功能.

文档仅提供了使用该$scope方法的示例,但我使用的controller as vm是John Papa和其他人推荐的方法.我试过用这种方式:

<div data-ng-controller="races as vm">
    <div ui-calendar="vm.calendarConfig" calendar="vm.calendar"></div>
</div>

在比赛控制器中我有以下内容:

vm = this;
vm.calendarConfig = { header: {...} };
vm.calendar = {};

// somewhere else in a separate click event
vm.calendar.fullCalendar('prev');    // ---> exception

最后一行抛出异常Object has no method 'fullCalendar'.

只是想知道我缺少什么,如果任何人有使用的例子ui-calendar有controller as vm语法.

以下是关于此事的人:http://plnkr.co/edit/DPo9meJHx19bREYFLhDh

Answer 1

感谢乔什·库尔兹的帮助。这就是我最终所做的：我混合使用了 $scope 和controller as方法。$scope基本上，我添加了对控制器的依赖。当我需要访问实际的日历控件时，我使用$scope.calendar.fullCalendar('...'). 该插件已更新，但脚本文件中的核心内容如下：

angular.module('app').controller(controllerId, ['$scope', races];
function races($scope) {
    var vm = this;
    ...
    function next() {
        $scope.calendar.fullCalendar('next');
    }
}

并在html中：

...
<div ui-calendar ng-model="vm.eventSources" calendar="calendar"></div>
...

没有我想要的那么干净，但对于我的目的来说它仍然足够干净。