dataSourceModelスコープ変数に双方向バインディングを持つディレクティブがありますが、何らかの理由で、ディレクティブで未定義として表示されています。私はここで何か間違ったことをしていますか?
プランカー:http://plnkr.co/edit/LxWMbY9qtDSBUPWNqWV7?p = Preview
コード:
HTML:
<div ng-controller='TestCtrl'>
<test-directive
selected-id='selectedId'
data-source-model='workOrderItems'> <!-- This does not work -->
</test-directive>
{{workOrderItems}} <!-- this works -->
</div>
脚本:
var app = angular.module("testApp", []);
app.controller('TestCtrl', ['$scope', function ($scope) {
$scope.workOrderItems = 'abcd';
$scope.selectedId = '123';
}]);
app.directive('testDirective',function () {
return {
restrict: 'E',
scope: {
selectedId: '=',
dataSourceModel: '='
},
replace: true,
template: "<div></div>",
link: function (scope, element, attrs) {
console.log(scope.selectedId, scope.dataSourceModel);
}
}
});
data-
はカスタムHTML5属性のプレフィックスであるため、ディレクティブ内でdata-source-model='workOrderItems'
のみsourceModel
に変換されます。
ディレクティブ属性の名前をデータで始まらないものに変更してみてください(またはHTMLでとして参照しdata-data-source-model
てください)。そうすれば機能するはずです。
この記事はインターネットから収集されたものであり、転載の際にはソースを示してください。
侵害の場合は、連絡してください[email protected]
コメントを追加