javascript - SweetAlert2, .then() - 不立即更新 DOM

Question

问题:
我想在甜蜜警报上单击“确定”后将用户重定向到另一个页面，但是在我出于某种原因打开另一个甜蜜警报之前，用户不会被重定向。
您可以在代码上断点，但页面上没有任何反应。

问题的简单示例:http://jsfiddle.net/ADukg/14306/

注意:包括 0 秒超时“解决问题”

重现:
1)注意箭头后面的文字.. $scope.name = "original"，可以看到页面上显示了。
2) 单击“先单击”按钮。这将运行函数 $scope.changeMe()，它将 $scope.name 更新为“delayed ......”
3) 到目前为止，按钮上方的文字应该已经更改。但直到你打开另一个甜蜜的警报，文本才会真正改变
4) 单击“then here”或“click first”按钮，弹出另一个甜蜜的警报，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;
    }
})

Answer 1

我在你的 fiddle 中看到了一些问题

1)swal 不是一个 Angular 库。所以它不会与 Angular 摘要循环一起工作，这就是为什么它仅在调用 $timeout 后才起作用。 this教程解释了为什么以及如何修复它。

2)我看到你添加了ng sweet alert作为依赖项，但在 Angular 之前调用，因此它不会在您的 fiddle 中注册，并且会出现控制台错误。

3) 如果您尝试使用 ng-sweet-alert，它不会使用此语法。您需要先将其包含在依赖项中

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

而且它不返回 promise ，需要以不同的方式调用它。

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