ajax保存要求の処理中に画面コンポーネントをフリーズする方法はありますか？

Question

私は基本的に大量のデータを保存していますが、保存中のデータが保存されるまで、他の画面やボタンにアクセスすることはできません。 代替方法も提案できます

Answer 1

インターセプタとオーバーレイを使用して行うことができます。 ボディの直接の子として、次のスタイルでオーバーレイを作成する必要があります。

#overlay{ 
    position : fixed; 
    left : 100%; 
    right : 100%; 
    top : 100%; 
    bottom : 100%; 

    width : 100%; 
    height : 100%; 

    display : none; 
} 

#overlay.show{ 
    display : block; 
    z-index : 500000; 
} 

このオーバーレイは、デフォルトでは表示されません。

app.factory('Inteceptor', function($rootScope) { 
int count = 0; 
var overlay = angular.element(document.getElementById('#overlay')); 
return { 
    request : function() { 
       if(count == 0) { 
        overlay.addClass('show'); 
       } 
       count++; 
    }, 
    requestError : function() {}, 
    reponse : function() { 
        count--; 
        if(count == 0) { 
         overlay.removeClass('show'); 
        } 
    }, 
    responseError : function() {} 
}}); 

これは、コンフィグレーションメソッドでインターセプタをプッシュする方法です。

$httpProvider.interceptors.push('Inteceptor');