如何使用Angular Js + bootsrap設置彈出窗口？

我正在開發一個角js和靴子的網站。如何使用Angular Js + bootsrap設置彈出窗口？

當網站加載我正在做一些服務器調用來獲取一些數據。這個過程需要一些時間。在這段時間內，我想顯示一個等待消息彈出。

但我卡在這裏如何與我的設置。在app.js中，在run方法中我想添加彈出調用來顯示並隱藏一次執行完成。

.run(["$log", "$rootScope", "$state", "dtoResource", "questionResource", function ($log, $rootScope, $state, dtoResource, questionResource) { 
        dtoResource.rc1Step1DTO() 
          .then(function (data) { 
           $rootScope.AutoQuote = data; 
           questionResource.getQuestions($rootScope.AutoQuote.postAutoQuoteObj.SessionInfo.StateCode) 
             .then(function (questions) { 
              $rootScope.questions = questions; 
              $rootScope.answers = {PC: 12345}; 
               console.log('Copy operation'); 
           angular.copy($rootScope.answers,$rootScope.default); 
           console.log($rootScope.answers); 
           console.log($rootScope.default); 
              }) 
          }) 
          .then(function() { 
           //console.log('This should be printed after the above methods are done  executing'); 
           // console.log($rootScope); 

          }) 

       }]) 
Below is plunker link

https://plnkr.co/edit/aV65Nab9U9I6YlK2g4sY?p=preview

來源

2016-08-22 pandu das

-1

在HTML代碼中添加

<div id="loading" class="hidden"><p>loading</p></div>

。

之前使得服務器添加以下內容：

$("#loading").removeClass("hidden");

，只是接收來自服務器插件響應後：

$("#loading").addClass("hidden");

來源

2016-08-22 09:38:33

你是在正確的軌道上。您需要在您的應用程序中包含角引導程序$ uibmodal模塊，然後您準備好

在調用save方法的模式上打開。下面的方法完成這項工作。

var instance = $modal.open();

堅持實例並根據保存的響應適當地調用它。

instance.dismiss();

以上將關閉您的信息彈出窗口。

看看我爲你創造的plunker。獲得ip地址相當快，但它模仿你的解決方案。

來源

2016-08-22 09:53:50 Alok

我可以在不使用ui-bootstrap-tpls-2.1.1.js，1.5.8/angular-animate.js，1.5.8/angular-sanitize.js的情況下創建彈出式窗口，這在應用程序中看起來很管用。 –

我同意這是一個小的開銷。您可以放棄角度動畫，但您需要該模板。如果你沒有使用Sanitize，那麼你錯過了角度的功能。 – Alok

現在無論我使用的是在我的搶劫者。 –

如何使用Angular Js + bootsrap設置彈出窗口？

回答

相關問題