未捕获(处于承诺状态)执行命令状态已锁定

时间:2018-09-17 11:47:52

标签: javascript angularjs

我正在尝试将Javascript库(An Image Editor)集成到有角JS应用程序中。我如何能够成功完成此任务,现在我需要使用该库的一些内置方法,但是我遇到了一个错误,该错误在这篇文章的标题中。

  

未捕获(承诺)执行命令状态被锁定。

我无法使用简单的方法来接收所需的详细信息。这是我一直在努力的代码。如果有人可以帮助我解决这个问题,那将非常感激。

angular.module('testapp', [])
  .factory('ImageEditor', ['$window', function($window) {
    return $window.ImageEditor;
  }])
  .controller('testCtrl', ['$window', function($scope) {
    var imageEditor = new tui.ImageEditor('#tui-image-editor-container', {
      includeUI: {
        loadImage: {
          path: './img/test.png',
          name: 'SampleImage'
        },
        theme: whiteTheme,
        menuBarPosition: 'bottom'
      },
      cssMaxWidth: 700,
      cssMaxHeight: 500,
      selectionStyle: {
        cornerSize: 20,
        rotatingPointOffset: 70
      }
    });

    imageEditor.addText('Init Text');

    window.onresize = function() {
      imageEditor.ui.resizeEditor();
    }
  }]);
<!DOCTYPE html>
<html ng-app="testapp">

<head>
  <meta charset="UTF-8">
  <title>ImageEditor</title>
  <link type="text/css" href="https://uicdn.toast.com/tui-color-picker/v2.2.0/tui-color-picker.css" rel="stylesheet">
  <link rel="stylesheet" href="https://uicdn.toast.com/tui-image-editor/latest/tui-image-editor.css">
  <style>
    @import url(http://fonts.googleapis.com/css?family=Noto+Sans);
    html,
    body {
      height: 100%;
      margin: 0;
    }
  </style>
  

  <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.7.2/angular.min.js"></script>
  <script type="text/javascript" src="./bower_components/tui-image-editor/examples/js/theme/white-theme.js"></script>
    <script type="text/javascript" src="./bower_components/tui-image-editor/examples/js/theme/black-theme.js"></script>
</head>

<body ng-controller="testCtrl">
  <div id="tui-image-editor-container"></div>


  <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/fabric.js/1.6.7/fabric.js"></script>
  <script type="text/javascript" src="https://uicdn.toast.com/tui.code-snippet/v1.3.0/tui-code-snippet.min.js"></script>
  <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/FileSaver.js/1.3.3/FileSaver.min.js"></script>
  <script type="text/javascript" src="https://cdn.rawgit.com/nhnent/tui.color-picker/v2.2.0/dist/tui-color-picker.js"></script>
  <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/FileSaver.js/1.3.3/FileSaver.min.js"></script>
  <script src="https://cdn.jsdelivr.net/npm/tui-color-picker@2.2.0/dist/tui-color-picker.min.js"></script>

  <script src="https://uicdn.toast.com/tui-image-editor/latest/tui-image-editor.js"></script>

</body>

</html>

1 个答案:

答案 0 :(得分:0)

对于生产代码,您不需要超时,只需要一个诺言链。这样,后续步骤将同步触发(即,一旦完成加载)。像这样:

echo "ABCD EFGH" | awk '{print gensub ( /(.+) (.+)/, "\\2 \\1", "g") }'
相关问题