4

この plnkrは、「AngularJS - ダイアログでコントローラーを開く (動的に読み込まれるテンプレート) 」という質問に答えるときに作成しました。

サンプル アプリが行うことは、テンプレートに基づいて独自のコントローラーを使用してダイアログ ボックスを起動することだけです。ダイアログが最初に起動すると、すべてが期待どおりに機能します。ただし、ダイアログを閉じた後、ダイアログを再起動しようとすると、モーダル背景が表示されますが、ダイアログは表示されません。thenjavascript コンソールで、返された promiseのメソッドがすぐに呼び出されることを確認できます$dialog.open()が、背景は削除されず、エラーは報告されません。私は完全に困惑しています。

ダイアログは angular-ui ブートストラップドキュメント ページで繰り返し開いたり閉じたりできます。

どこで私は間違えましたか？

HTML:

<!DOCTYPE html>
<html ng-app="plnkr">

  <head>
    <link data-require="bootstrap-css@*" data-semver="2.3.2" rel="stylesheet" href="//netdna.bootstrapcdn.com/twitter-bootstrap/2.3.2/css/bootstrap-combined.min.css" />
    <script data-require="angular.js@1.0.7" data-semver="1.0.7" src="http://code.angularjs.org/1.0.7/angular.min.js"></script>
    <script data-require="ui-bootstrap@0.3.0" data-semver="0.3.0" src="http://angular-ui.github.io/bootstrap/ui-bootstrap-tpls-0.3.0.min.js"></script>
    <link rel="stylesheet" href="style.css" />
    <script src="script.js"></script>
  </head>

  <body>
    <div ng-view></div>
  </body>

</html>

JS:

app.controller("DemoCtl", ["$scope", "$dialog", function($scope, $dialog){
  $scope.launch = function() {
    var d = $dialog.dialog({
      backdrop: true,
      keyboard: true,
      backdropClick: true,
      templateUrl: "dialog.html",
      controller: "DialogCtl"
    });

    d.open().then(function(result) { console.log("d.open().then"); });
  };
}]);
4

3 に答える 3

0

「javascript:;」を入れるとこんな感じ href で、 <a> タグに対しては正常に機能します。

このような：

<a href="javascript:;" ng-click="launch()">Open the dialog</a>

また、 <a> タグの問題はブラウザ関連のようです。

于 2013-09-04T06:33:08.573 に答える
0

問題は確かにタグにあります。Jason は、Angular ディレクティブが場所の変更を停止することを期待していると述べました。これはそうですが、href を空白にする必要があります。プランカーは

<a href="javascript:;" ng-click="launch()">Open the dialog</a>

そしてそうあるべきだった

<a href="" ng-click="launch()">Open the dialog</a>

プランカーをその効果に変更したとき、すべてが問題ないように見えました

于 2014-09-19T13:44:52.533 に答える