Двухстороннее связывание данных с директивой не работает

Question

У меня есть контроллер, используемый для добавления задач. На этой странице пользователь должен выбрать группу для действий. Я написал директиву, которая позволяет пользователю выбирать группы (папки)

Контроллер моей страницы

function AddTaskController($scope) {
    var vm = this;

    vm.group = { whatsit: true };

    $scope.$watch("vm.group", function () {
        console.log("controller watch", vm.group);
    },true);
}

HTML-страница, где используется директива

<em-group-selection group="vm.group"></em-group-selection>

Директива конфигурации

function GroupSelectionDirective() {
    return {
        scope: {
            group: '='
        },
        controller: GroupSelectionDirectiveController,
        controllerAs: 'vm',
        templateUrl: '/views/templates/common/folderselection.html'
    };
}

Директивный контроллер:

function GroupSelectionDirectiveController($scope) {
    var vm = this;

    $scope.$watch("group", function () { console.log("yo1", vm.group); }, true)
    $scope.$watch("vm.group", function () { console.log("yo2", vm.group); }, true)
}

Теперь, когда это срабатывает, оба console.log() вызывает в директиве огонь один раз, с undefined, Они никогда не стреляют снова. Если в контроллере я установил vm.group к чему-то еще $watch в AddTaskController никогда не уволят

Почему не работает привязка данных?

---

Обновить:

Я замечаю, что если в директиве я init() функция в моей директиве использовать $scope оно работает! Не могу ли я, как предлагает Федайкин, использовать controllerAs с двухсторонней привязкой данных?

function init() {
    $timeout(function () {
        $scope.group.shizzy = 'timeout hit';
    }, 200);
}

Answer 1

Оказывается, что если вы используете изолировать области и controlelrAs Синтаксис нужно также использовать bindToController : true, Без этого вы не сможете использовать только vm и придется использовать $scope для изолирующих переменных области видимости

Более подробную информацию можно найти в руководстве по стилю Джона Папа и в этом ответе SO

Окончательная настройка директивы такова:

function GroupSelectionDirective() {
    return {
        scope: {
            group: '='
        },
        controller: GroupSelectionDirectiveController,
        controllerAs: 'vm',
        bindToController: true,
        templateUrl: '/views/templates/common/folderselection.html'
    };
}