javascript - 无法获取自定义指令属性值

Question

我有一个名为“mycomponent”的自定义指令。

restrict: 'AE',     
templateUrl: 'template.html',
scope:{
    sTransactionType: '=transactionType',
    sStorageVariable: '=storageVariable'                
},
link: function(scope, element, attrs){              
    console.log("attrs.transactionType:: "+attrs.transactionType);
    console.log("scope.sTransactionType:: "+scope.sTransactionType);

标记为:

<my-component transaction-Type="FundTransfer" storage-Variable="FundTransferToday"></my-component>

现在，当我尝试在指令的 link 函数中访问属性 transaction-Type 和 storage-Variable 的值时，它返回未定义。值可以通过 attrs.transactionType 访问，但不能通过 scope.sTransactionType 获取。

我试图更改属性名称、范围变量名称。

如何获取范围变量中的自定义指令属性值？

更新后的代码:

var fundtransfer = angular.module("fundtransfer",['mydirectives']);
var controllers = {};
controllers.cntFundTransfer = function($scope, $rootScope){
}

var mydirectives = angular.module("mydirectives",['Constants']);
mydirectives.directive('myComponent', function($rootScope){
restrict: 'AE',     
templateUrl: 'template.html',
scope:{
    sTransactionType: '=transactionType',
    sStorageVariable: '=storageVariable'                
},
link: function(scope, element, attrs){              
    console.log("scope.sTransactionType:: "+scope.sTransactionType);
}
}

<my-component transaction-type="FundTransfer" storage-variable="FundTransferToday"></my-component>          

Answer 1

你的属性命名是错误的。

全部小写

这样试试

<my-component transaction-type="FundTransfer" storage-variable="FundTransferToday"></my-component>

JS

restrict: 'AE',     
templateUrl: 'template.html',
scope:{
    sTransactionType: '=transactionType',
    sStorageVariable: '=storageVariable'                
},
link: function(scope, element, attrs){              
    console.log("scope.sTransactionType:: "+scope.sTransactionType);
}