2

我正在尝试使用 angular-ui tinymce 指令。我使用 Nuget 来获取 angular-ui (v 0.4.0)、tinymce.jquery (v 4.0.6) 和 tinymce (v 4.0.6) 包。我将 ui 指令添加到我的角度模块中，并在我的页面上引用了以下脚本（按顺序）：

  <script src="Scripts/jquery-1.10.2.js"></script>
    <script src="Scripts/tinymce/tinymce.min.js"></script>
    <script src="Scripts/tinymce/jquery.tinymce.min.js"></script>
    <script src="lib/angular/angular.min.js"></script>
    <script src="Scripts/angular-ui.min.js"></script>

当我导航到包含我用 装饰的 textarea 的部分时ui-tinymce ng-model="tinymce"，我可以在 Chrome 的 javaScript 控制台中看到我的标题中列出的错误 (angular.min.js)。

我在网上搜索并尝试了一些建议，例如更改脚本引用的列表，但我尝试过的都没有。我是否缺少关键组件，是否有不正确的引用（或乱序）或其他原因？我遇到了一些小提琴，但大多数都坏了或坏了。我还没有看到一个提供我可以使用的工作演示。

编辑：好的，现在我收到错误：“无法在 angular-ui.min 处调用未定义的方法‘添加’”。我没有更改代码中的任何内容，因此原始错误消息可能来自之前的尝试？

4

1 回答 1

2

您收到的错误是由于 tiny-mce (4.0.6) 和 angular-ui (0.40) 包之间的版本不匹配而发生的。

查看 tinyMCE 的 4.x 的 apionSetContent()不存在并已替换为.on()

看起来好像ed.onSetContent()存在于 TinyMCE 3.x中。

话虽如此，如果您将 tinymce 包替换为 3.x 版本，那么现在所有内容都应该可以很好地协同工作。

已安装的软件包

<?xml version="1.0" encoding="utf-8"?>
<packages>
  <package id="Angular.UI" version="0.4" targetFramework="net45" />
  <package id="angularjs" version="1.0.7" targetFramework="net45" />
  <package id="jQuery" version="1.9.1" targetFramework="net45" />
  <package id="Select2.js" version="3.2.1" targetFramework="net45" />
  <package id="TinyMCE" version="3.5.8" targetFramework="net45" />
  <package id="TinyMCE.JQuery" version="3.5.8" targetFramework="net45" />
</packages>

安装软件包后，您可以使用以下视图将其全部连接起来：

<body ng-app="MyApp">

    <textarea ui-tinymce="" ng-model="tinymce"></textarea>
    {{tinymce}}
    <script src="Scripts/jquery-1.9.1.min.js"></script>
    <script src="Scripts/angular.js"></script>
    <script src="Scripts/angular-ui.js"></script>
    <script src="Scripts/tinymce/tiny_mce.js"></script>
    <script src="Scripts/tinymce/jquery.tinymce.js"></script>

    <script>
        var myApp = angular.module("MyApp", ["ui"])
    </script>
</body>

github上的工作应用程序

于 2013-09-20T00:31:36.850 回答