AngularJS Почему мой контроллер не отвечает?

Question

Это сложный вопрос, я постараюсь быть кратким:

У меня есть простой контроллер, который я хочу использовать для получения информации из API и заполнения списка выбора из trello.

Вот мой контроллер:

function TrelloController($scope, $location, $routeParams, $timeout, dialogs, common){
    var vm = this;
    var controllerId = 'TrelloController';
    var getLogFn = common.logger.getLogFn;
    var log = getLogFn(controllerId);
    var logError = getLogFn(controllerId, 'error');
    var scope = $scope;
    var TRELLO = require("trello");
    var key = '<my key>';
    var token = '<my token>';
    var trello = new TRELLO(key, token);

    vm.title = "Trello Controller";
    vm.addCard = addCard;
    vm.getBoards = getBoards;
    vm.toggle = toggle;
    vm.getLists = getLists;
    vm.getListsFromDictionary = getListsFromDictionary;
    vm.isTrelloActive = false;

    activate();

    function activate(){
        common.activateController([], controllerId)
            .then(function () {
                log('Activated Trello Controller');
                initialise();
            });
    }
    function initialise() {
        vm.isTrelloActive = false;
        getBoards();
        getLists();
    }

    function toggle() {
        vm.isTrelloActive = !vm.isTrelloActive;
        log("TOGGLE CLICKED");
    }

    function addCard(cardName, cardDescription, listId) {
        trello.addCard(cardName, cardDescription, listId, function (error, cardAdded) {
            if (error) {
                log("Could Not Add Card: ", error);
            } else {
                log("Card added: ", cardAdded.name);
            }
        });
    }

    function getBoards() {
        trello.getBoards("me", function (error, boards) {
            if (error) {
                log("Could Not Get Boards: ", error);
            } else {
                log("found " + boards.length + " boards");
                console.log(boards);
            }
            scope.boards = boards;
        });
    }

    function getLists(){
        for (var i=0; i<scope.boards.length; i++){
            getListsWithBoardId(scope.boards[i].id, i);
        }
    }

    function getListsWithBoardId(boardId, index){
        trello.getListsOnBoard(boardId, function(error, lists){
            if (error) {
                log("Could Not Get Boards: ", error);
            } else {
                log("found " + lists.length + " lists on board:"+boardId);
                console.log(lists);
            }
            scope.boards[index].lists = lists;
        });
    }

    function getListsFromDictionary(boardId){
        for (var i=0; i<scope.boards.length; i++) {
            if(scope.boards[i].id == boardId){
                return scope.boards[i].lists;
            }
        }
    }
}module.exports = TrelloController;

Этот контроллер предназначен для управления моим диалогом, упрощенно, это тот диалог:

<div data-ng-controller="TrelloController as vm">
    <div class="modal-header">
        <img class="trelloLogo" name="trelloLogo" src="public/content/images/trello-mark-blue.png" alt="Add To Trello" ng-click="vm.toggle}">
        <h3>{{parameter.heading}}</h3>
    </div>
    <div class="modal-body">
        <form name="form">
            <div ng-if="vm.isTrelloActive" class="form-group">
                <label>Board</label>
                <select name="typeInput" class="form-control" ng-required="true" ng-model="form.boardInput">
                    <option selected>Choose Board</option>
                    <option ng-repeat="board in scope.boards" value="{{board.id}}">{{board.name}}</option>
                </select>
            </div>
        </form>
    </div>

    <!-- This section contains parts in the vm.addCard(...) that aren't included in this shortened version of The HTML template, I provided it with the additional fields for context of the API call at the end --> 

    <div ng-if="vm.isTrelloActive" class="modal-footer">
        <button class="btn btn-primary" ng-disabled="!form.$dirty || !form.$valid" ng-click="vm.addCard(form.titleInput, form.descriptionInput, form.listInput)">Add To Board</button>
        <button class="btn btn-default" ng-click="vm.isTrelloActive=false">Cancel</button>
    </div>
</div>

КогдаЯ нахожусь в диалоге. Нажатие кнопки с логотипом, похоже, ничего не делает, даже если для нее было предварительно установлено: ng-click="vm.isTrelloActive = !vm.isTrelloActive", это переключало бы всю страницу.Метод активации не создает журналы и не запускается при нажатии.

Почему это происходит?