angularjs - 无法在指令模板中使用指令 Controller 值

Question

我很难访问从该指令模板传递到我的指令的属性。我希望能够从 album.tmpl.html 访问“companyId”，但无论我如何尝试，我都无法获取它。最奇怪的部分是我可以看到它已经进入 Controller ，但不知何故它没有从 Controller 进入模板。我知道模板正确地调用了 Controller ，因为它可以成功打印出在 Controller 内部初始化的“testVar”的值。任何建议将不胜感激。

指令+指令 Controller

(function () {
'use strict';
angular.module('erCommon')
    .directive('erAlbum', albumDirective)
    .controller('AlbumController', AlbumController);

function AlbumController() {
    var vm = this;
    vm.testVar = "test var initiated";
}

function albumDirective($log) {
    function albumLink(scope, element, attrs, AlbumController) {
        //watch vars in here
    }

    return {
        restrict: 'E',
        scope: {
            companyId: '=companyId'
        },
        bindToController: true,
        templateUrl: 'components/temp/album.tmpl.html',
        controller: 'AlbumController',
        controllerAs: 'albumCtrl',
        link: albumLink
    };
}

})();

模板( album.tmpl.html

 <div ng-controller="AlbumController as albumCtrl">
    testVar: {{albumCtrl.testVar}}<BR>
    companyId:{{albumCtrl.companyId}}<BR>
 </div>

用法

<er-album company-id="2"></er-album>

输出

test var: test var initiated
companyId: 

Answer 1

您需要从模板中删除 ng-controller:

<div>
    testVar: {{albumCtrl.testVar}}<BR>
    companyId:{{albumCtrl.companyId}}<BR>
</div>