瞭解綁定在組件

Question

我不明白在角components的結合。我已將這material FAB demo重新組合到一個組件。所以沒有ng-controller指令了。但是我無法使bindings: {isOpen: '='}的綁定正常工作。我得到以下錯誤：

Expression 'undefined' in attribute 'isOpen' used with directive 'tsButton' is non-assignable!

的代碼看起來是這樣的：

<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: '='是行不通的，因爲我給它一個原始值。爲了這個工作，當然必須是參考。