我正在尝试使用 angular-ui tinymce 指令。我使用 Nuget 获取 angular-ui (v 0.4.0)、tinymce.jquery (v 4.0.6) 和 tinymce (v 4.0.6) 软件包。我将 ui 指令添加到我的 Angular 模块中,并在我的页面上引用了以下脚本(按顺序):
<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>
当我导航到包含我用 ui-tinymce ng-model="tinymce"
装饰的文本区域的部分时,我可以看到我的列表中列出的错误 (angular.min.js) Chrome 的 JavaScript 控制台中的标题。
我已经在网络上进行了搜索并尝试了一些建议,例如更改脚本引用的列表,但我尝试过的任何方法都不起作用。我是否缺少一个关键组件,是否有错误的引用(或无序),或者其他什么?我遇到过一些 fiddle ,但大多数都坏了或坏了。我还没有看到一个可以提供我可以使用的工作演示的产品。
编辑:好的,现在我收到错误:“无法在 angular-ui.min 调用未定义的方法‘Add’”。我没有更改代码中的任何内容,因此原始错误消息可能来自之前的尝试?
最佳答案
您收到的错误是由于 tiny-mce (4.0.6) 和 angular-ui (0.40) 包之间的版本不匹配而发生的。
查看tinyMCE 4.x 的api onSetContent()
不存在,已被替换为 .on()
看起来像ed.onSetContent()
exists in TinyMCE 3.x .
话虽这么说,如果您用 3.x 版本替换tinymce 软件包,那么现在一切都应该可以很好地协同工作。
已安装的软件包
<?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>
安装软件包后,您可以使用以下 View 将其全部连接起来:
<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>
关于tinymce - 使用 Angular-UI 和 TinyMCE,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/18878146/