不从Angular中的ng-click链接调用控制器功能

Question

我使用带有custom cell template和cell modifier的Angular Bootstrap日历。在我的控制器中，我在每天的单元格中构建了一堆表。有些单元格有一个链接，当点击它时，应该在我的控制器中运行一个函数来添加或删除后端的记录并更改单元格的内容。

这是ui-router定义：

  $stateProvider
    .state('home', {
      url: '/',
      templateUrl: 'views/home.html',
    })
    .state ('calendar', {
      url : '/calendar',
      templateUrl: 'views/calendar/index.html',
      controller: 'calendarController',
      controllerAs: 'vm'
    });

以下是相关的控制器代码：

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

    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.
    var stationPromise = shiftService.getStationConfig().then(function(data) {
      vm.configSlots = data;
    });

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

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

    vm.addName = function(userId) {
      // Code to add name to back end.

    };

    vm.removeName = function(userId) {
      // Code to remove name from back end.
    };

    -- rest of controller code goes here

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

这里是日历单元格的自定义模板。

<div class="cal-month-day">

    <span
      class="pull-right"
      data-cal-date
      ng-click="calendarCtrl.dateClicked(day.date)"
      ng-bind="day.label">
    </span>

  <div ng-if="day.todayHasShifts">{{ day.text }}</div>

      <table ng-class="{ today: day.isToday }" class="table table-bordered table-condensed">
          <thead>
            <tr>
              <td>Station</td>
              <td>Position</td>
              <td>Name</td>
            </tr>
          </thead>
            <tbody ng-repeat="shift in day.shiftTables">
              <tr ng-repeat="slot in shift.slots">
                <td align="top" ng-attr-rowspan>{{ shift.station }}</td>
                <td>{{ slot.position }}</td>
                <td ng-if="slot.nameOption == 'printNameRemove'" class="print-name-remove"><a href="" ng-click="vm.removeName(slot.name)">{{ slot.name }}</a></td>
                <td ng-if="slot.nameOption == 'printName'" class="print-name">{{ slot.name }}</td>
                <td ng-if="slot.nameOption == 'printSignupLink'" class="print-signup-link"><a href="" ng-click="vm.addName(slot.name)">Sign Up</a></td>
                <td ng-if="slot.nameOption == 'printBlank'" class="print-blank"></td>
              </tr>
              <tr>
                <td colspan="3">
              </td>
            </tr>
          </tbody>
      </table>

我遇到的问题是单击链接不会触发控制器中的addName和removeName函数。我确定我必须遗漏一些明显的东西，但我不知道它是什么。我需要改变什么？

感谢。