$ Modalにはメソッドがあり、オープン、この方法のプロパティが紹介されていることをお知らせください。
TemplateUrl:モーダルウィンドウのアドレス
テンプレート:HTMLタグを表示するために使用されます
範囲:モーダルスコープでコンテンツを使用します(実際、$ MODALは現在のスコープのサブスコープを作成します)デフォルトでは$ Rootscopeです
コントローラー:$ modalで指定されたコントローラーは、$ scopeを初期化します。これは$ modalinstanceで注入できます
Resolve:メンバーを定義し、$ Modalで指定されたコントローラーに渡します。これは、ルートの再ルーブプロパティに相当します。オブジェクトオブジェクトを渡す必要がある場合は、angular.copy()を使用する必要があります
背景:背景、許容値を制御:true(default)、false(no no no no no background)、 "static" - 背景が存在しますが、モーダルウィンドウの外側をクリックすると、モーダルウィンドウは閉じません
キーボード:ESCが押されたら、モーダルダイアログボックスが閉じられているかどうか、デフォルトでtureに
WindowClass:クラスを指定し、モーダルウィンドウに追加します
オープンメソッドは、次のプロパティでインスタンスを返します。
閉じる(結果):モーダルウィンドウを閉じて結果を渡します
却下(理由):モーダル方法を元に戻し、理由を渡します
結果:モーダルウィンドウが閉じられたり取り消されたりしたときに渡される契約
オープン:契約、モーダルウィンドウが開いてコンテンツがロードされたときに変数が通過します
さらに、$ ModAlinStanceは2つの方法を拡張します$ close(result)、$ dismiss(理由)。
<!doctype html> <html ng-app = "modaldemo"> <head> <title> </title> <link href = "lib/css/bootstrap.min.css" lel = "styleSheet"> <script src = "lib/angular.min.js"> </script src = "lib/bootstrap-gh-pages/ui-bootstrap-tpls-0.7.0.min.js"> </script> <scrip = "lib/angular/i18n/angular-locale_zh-cn.js"> </script> </head> <body type = "text/ng-template" id = "mymodalcontent.html"/> <div> <h3>私はモーダルです!</h3> </div> <ul> <ul> <li ng-repeat = "item inアイテム"> <ang-click = "selected.item = item"> {{{{{{{bi> selected.item}} </b> </div> <div> <button ng-click = "ok()"> ok </button> <button ng-click = "cancel()"> cancel </button> </div> </script> <button ng-click = "open()"> open me!</button> </div> modaldemo 'modaldemo' modaldemo 'modaldemo' modaldemo 'ui.bootstrap'])); var modaldemoctrl = function($ scope、$ modal、$ log){$ scope.items = ['item1'、 'item2'、 'item3']; $ scope.open = function(){var modalinstance = $ modal.open({mymodalcontenter: 'mymodalcontentententententententer modalinstancectrl、resolve:{items:function(){return $ scope.items;}}}}); modalinstance.opened.then()then(){//モーダルウィンドウが開かれた後に実行され、背景は常にモーダルウィンドウが開かれた後、常に開始されます。 new date());});} {$ modalinstance.close($ scope.selected);}; $ scope.cancel = function(){$ modalinstance.dismiss( 'cancel');};}; </script> </body> </html>上記は、編集者が紹介したAngularJs $ Modal Popup Boxの例コードです。それがあなたに役立つことを願っています。ご質問がある場合は、メッセージを残してください。編集者は時間内に返信します。 wulin.comのウェブサイトへのご支援ありがとうございます!