ポップアップ/モーダルダイアログボックスに表示する必要がある約12個のテンプレート(将来的にはさらに増える予定)があるプロジェクトを行っています。私はグーグルで検索しましたが、私が見た解決策(例)があまり好きではなかったので、自分で作成することにしました.
私はコントローラーにこのようなインターフェースを持たせることに取り組んでいます。
$scope.popup1Buttonclicked = function(){
dialogService.showdialog("popup1",$scope.popup1data,function(result,data){
if(result == "OK"){
//save data
}
});
};
そして、私のダイアログサービスでは、次のようなことをしています:
myApp.service("dialogService",function($compile){
this.showdialog = function(popupid,data,callback){
var html = "<div>name: {{data.name}}</div>";
var element = $compile(html)(data);
$("#pop").append(element);
//$("#pop").showDialog(element);
};
});
ダイアログボックスが閉じられた後、更新されたデータをコールバック関数に渡すことができるように、ポップアップで双方向バインディングが必要です。
プランカーをチェックしてください: http://plnkr.co/edit/uhZ0r0rXCacnvoyCP7nQ?p=preview
誰かが私を正しい方向に向けることができますか?