Понимать привязки в компонентах

Question

Я не получаю привязку в угловых компонентах. Я переделал этот материал FAB demo для компонента. Так нет ng-controller директива больше. Однако я не могу сделать привязки bindings: {isOpen: '='} работать. Я получаю следующую ошибку:

Выражение "undefined" в атрибуте "isOpen", используемом с директивой "tsButton", не присваивается!

Код выглядит так:

<div ng-cloak>
<md-fab-speed-dial
        md-open="$ctrl.isOpen"
        ng-mouseenter="$ctrl.isOpen=true"
        ng-mouseleave="$ctrl.isOpen=false">
    <!-- buttons and trigger -->
</md-fab-speed-dial>

(function () {
'use strict';

angular
    .module('trip')
    .component('tsButton', {
    templateUrl: "app/component/button.component.html",
    controller: ButtonController,
    });

    function ButtonController() {
        var vm = this;

        vm.isOpen = false;
    };
}
})();

Если я опущу bindings: {isOpen: '='} затем md-open="$ctrl.isOpen" не распространяется.

Обходной путь должен определить методы для ng-mouseenter="$ctrl.open()" а также ng-mouseleave="$ctrl.close()" что в контроллере назначить правильный логический vm.isOpen, Но, как я уже сказал, это всего лишь обходной путь, который делает код длиннее, помимо всего прочего.

Answer 1

isOpen: '=' не работал, потому что я придавал ему примитивное значение. Для того, чтобы это работало, это должно было быть ссылкой конечно.