初めまして。
Angularjsでアプリを開発しています。
以下のようなことをやりたいのですが、(Angularjsの理解不足もあって)実装をどうやっていいのかわかっていない状態です。
恐縮ですが、どなたか、ご助言をお願いしたく。
やりたいこと
順を追って。
jquery-uiみたいに、内容をDialog化するディレクティブを作りました。
javascript
1//(※)一部簡略化しています。 2angular.module('app').directive('dialog', function(){ 3 return { 4 restrict : 'E', 5 controller : ['$scope', function($scope){ 6 this.open = function() { /* 実装 */ } 7 // その他初期化処理 8 }], 9 controllerAs : 'dialog', 10 replace : true, 11 transclude : true, 12 template : '<div>' + 13 '<div' + 14 ' style="width: {{ dialog.dialogSize.width }}; height: {{ dialog.dialogSize.height }};"' + 15 ' ng-transclude>' + 16 '</div>' + 17 '</div>', 18 19 link : function(scope, element, attrs) { 20 // dialog化するコード... 21 } 22 }; 23});
以下のように、ダイアログごとの実装を別途ディレクティブ化して、そのテンプレートに埋め込みで使う予定です。
javascript
1//(※)一部簡略化しています。 2angular.module('app').directive('addDialog' { 3 restrict = 'E'; 4 controller = [AddDialogDirectiveController]; 5 controllerAs = 'addDialog'; 6 replace = true; 7 templateUrl = templateBaseUrl + '/add-dialog.html'; 8};
html
1<div> 2 <dialog> 3 実装 4 </dialog> 5</div>
次が本件なのですが、
この実装ディレクティブ<add-dialog>
を埋め込んだHTMLソースから、<dialog>
ディレクティブのメソッドを呼びたいのですが、どうやって呼び出すかがわからないのです。
HTML
1<add-dialog></add-dialog> 2 3<!-- できれば、こういう感じで呼び出したい・・・。 --> 4<button type="button" ng-click="addDialog.open()">+新しいデータ</button>
できれば、addDialog
のスコープ?に乗っけたいのですが。。
よろしくお願いいたします。
回答1件
あなたの回答
tips
プレビュー
バッドをするには、ログインかつ
こちらの条件を満たす必要があります。
2016/02/28 17:59