無法在指令模板中使用指令控制器值

我很難從該指令的模板中訪問傳遞給我的指令的屬性。我想能夠從album.tmpl.html訪問'companyId'，但無論我嘗試什麼，我都無法得到它。最奇怪的部分是我可以看到它已進入控制器，但不知何故，它不是從控制器到模板。我知道該模板正確地調用控制器，因爲它可以成功地打印出在控制器內初始化的'testVar'的值。任何意見，將不勝感激。無法在指令模板中使用指令控制器值

指令+指令控制器

(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:

來源

2015-10-02 owlyfool

您需要從模板中刪除NG控制器：

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

來源

2015-10-02 12:12:04 melsaqqa

輝煌，謝謝你，這就是問題所在。當然，我創建指令時已經將控制器綁定到模板，所以ng-controller是完全不必要的，但我仍然不確定爲什麼使用ng-controller會導致這樣的問題。 – owlyfool

達到你想要我只好稍微修改代碼的結構造成的。希望這可以幫助你理解這個問題。查找有關Angular使用指令的獨立範圍的材料。

HTML：

<div ng-app="erCommon" ng-controller="AlbumController as albumCtrl"> 
    <er-album company-id="2" test = "albumCtrl.testVar"></er-album> 
</div>

控制器：

angular.module('erCommon', []) 
    .directive('erAlbum', albumDirective) 
    .controller('AlbumController', AlbumController); 

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

function albumDirective() { 
    return { 
     restrict: 'E', 
     scope: { 
      test: '=test', 
      companyId: '@companyId' 
     }, 
     template: '<div> testVar: {{test}}<BR> companyId:{{companyId}}<BR> </div>', // it will work fine with templateUrl as well, just didn't want to cr8 another file... 
     link: function(scope, element, attrs){ 
      //do whatever else you might need; 
     } 
    }; 
}

來源

2015-10-02 13:01:01 ZenDD

無法在指令模板中使用指令控制器值

回答

相關問題