SweetAlert2，。那麼（） - 不更新DOM立即

問題：
我想點擊甜蜜警報OK後，用戶到另一個頁面重定向，但用戶不重定向，直到我打開了另一個甜蜜由於某種原因警覺。
您可以通過代碼斷點，但頁面上沒有任何反應。SweetAlert2，。那麼（） - 不更新DOM立即

問題的簡單的例子：http://jsfiddle.net/ADukg/14306/

注意：包括0秒超時「解決問題」

重現：
1）注意箭頭.. $範圍後的文字.name =「original」，你可以看到它顯示在頁面上。
2）點擊「點擊第一個」按鈕。這將運行函數$ scope.changeMe（），它將$ scope.name更新爲「delayed .......」
3）現在，按鈕上方的文本應該已經更改。但直到你打開另一個甜蜜的警報文本實際上改變
4）點擊「然後在這裏」或「點擊第一個」按鈕，所以另一個甜蜜的警報彈出，DOM最終會改變。

我敢肯定，這與AngularJS有關，必須使用1.4.3。

任何想法？

HTML：

<div ng-controller="MyCtrl"> 
    <div> 
    <button ng-click="changeMe()">click first</button> 
    <button ng-click="decoy()">then here</button> 
    </div> 
    <div> 
    <button ng-click="reset()">reset text</button> 
    <div> 
</div>

JS：

var myApp = angular.module('myApp',[]); 

myApp.controller("MyCtrl", function($scope, $timeout) { 
    $scope.name = 'original'; 
    $scope.copy = angular.copy($scope.name); 

    $scope.changeMe = function() { 
     swal("Text should change now") 
     // runs on hitting "OK" 
     .then(function() { 
        // UNCOMMENT THIS and re-run the fiddle to show expected behavior 
      // $timeout(function() { $scope.displayErrorMsg = false; }, 0); 
      $scope.name = 'delayed.......' 
     }) 
    } 

    $scope.decoy = function() { 
     swal("Look at the text now"); 
    } 

    $scope.reset = function() { 
     $scope.name = $scope.copy; 
    } 
})

來源

2017-09-21 Sergnio

除非SweetAlert庫是爲Angular設計的，否則它將在Angular上下文外運行。必須調用Angular的摘要循環才能使更改生效。 'ng-click'應用摘要循環，這就是您在第二次點擊後看到更改的原因。 '$ timeout'也調用摘要循環。看看你的例子'$ scope。$ apply（）'added：http://jsfiddle.net/ADukg/14313/ –

[ngSweetAlert]（https://github.com/oitozero/ngSweetAlert）是要走的路你希望與angular進行適當的整合，否則你必須使用'$ scope。$ apply（）'作爲@AlexK上面提到的手動通知這種模型更改的角度。 –

@AlexK完全解決了我的問題。我創建了一個Angular包裝工廠，每一次我們都會使用甜蜜的警報。謝謝你的幫助！感謝您的確認Matthew Cawley！ – Sergnio

我看到你擺弄一些問題

1）SwaI位不是一個角庫。所以它不會與角度摘要循環一起工作，這就是爲什麼它只在$ timeout被調用後才起作用。 this教程解釋了爲什麼以及如何解決它。

2）我看到您已添加ng sweet alert作爲依賴項，但在角度之前調用，所以它不會在您的小提琴中註冊並且存在控制檯錯誤。 3）如果你嘗試使用ng-sweet-alert，它不會使用這種語法。您需要首先將其包含在依賴項中

var myApp = angular.module('myApp',['oitozero.ngSweetAlert']);

而且它不返回承諾，它需要以不同的方式調用。

SweetAlert.swal("Here's a message");

來源

2017-09-21 21:24:22

SweetAlert2，。那麼（） - 不更新DOM立即

回答

相關問題