2

Angular-Strap を使用してモーダルを提供していますが、モーダルを閉じてから別のページに移動する際に問題が発生しています。何らかの理由で、 $location.path を使用していない場合にのみモーダルを閉じることができます。追加すると、モーダル自体が閉じられ、新しいページに移動しますが、灰色の背景が残ります。コールバックを探していましたが、これら 2 つのアクションを一緒に行う方法がわかりませんでした。

モーダルコール

var modal = $modal({
            template: '/Product/Delete',
            persist: true,
            show: false,
            backdrop: 'static',
            scope: $scope
        });

呼び出してモーダルを開く

$scope.confirmDeleteProduct = function () {
            $q.when(modal).then(function (modalEl) {
                modalEl.modal('show');
            });
        };

モーダルで削除を押したときに行われる呼び出し

$scope.deleteProduct = function (id,dismiss) {
            //ProductSvc.deleteProduct(id).success(function ($resp) {
            dismiss();
            //$scope.hideDeleteModal = true;
            $location.path('product/');

            //});
            //$scope.products = _.without($scope.products, product);
        };

モーダルを削除

<div class="modal-dialog">
    <div class="modal-content">
        <div class="modal-header">
            <button type="button" class="close" data-dismiss="modal" aria-hidden="true">x</button>
            <h4>Delete Product</h4>
        </div>
        <div class="modal-body">
            <p>Do you really want to delete the product <strong>{{product.Name}}</strong>?</p>
        </div>
        <div class="modal-footer">
            <button type="button" class="btn" ng-click="dismiss()">Cancel</button>
            <button type="button" class="btn btn-primary" ng-click="deleteProduct(product.Id,dismiss);">Delete</button>
        </div>
    </div>
</div>
4

2 に答える 2

7

私はトニーとまったく同じ問題を抱えています。さて、これは汚い気がしますが、 $(modal).modal('hide') またはトグルを呼び出した後、場所が変更された後も .modal-backdrop が画面に残ることに気付きました。だから、私はこれをしました：

$('#cancelModal').modal('toggle');
$('.modal-backdrop').remove();
$location.path('/');

angular-strap または angular-ui ブートストラップを使用することを提案する同様の投稿がいくつかありますが、現時点ではどちらの方向にも進みたくありません。

編集: UI ブートストラップ

于 2014-01-09T16:00:09.527 に答える
0

私もこの問題を抱えていました。angular ブートストラップ 0.13.0 を使用している場合は、0.12.1 にダウングレードしてみてください。これで問題は解決しました。

原因は、ngAnimate 1.4.2 https://github.com/angular-ui/bootstrap/issues/3633との非互換性のようです。

于 2015-07-09T00:51:24.603 に答える