【问题标题】:Angularjs - tinyMCE 4 directive not working after using sortableAngularjs - tinyMCE 4指令在使用可排序后不起作用
【发布时间】:2013-08-20 20:40:27
【问题描述】:
我正在使用 AngularUI 指令使用 AngularJS 构建一个项目:ui.tinymce 和 ui.sortable。
这是我的代码:
<ul ui-sortable="sortableOptions" ng-model="appData.data">
<li ng-repeat="box in appData.data" boxlistitem>
<textarea ng-model="box.title" value="{{box.title}}" class="tinyMCE" ui-tinymce="tinymceOptions"></textarea>
</li>
</ul>
基本上它工作得很好,但是一旦我对列表项中的一个进行排序,就会发生一件奇怪的事情——tinyMCE 不再工作(见附图——左边是它应该是的样子)。
知道可能是什么问题吗?
谢谢,
丹尼尔
【问题讨论】:
标签:
javascript
angularjs
tinymce
jquery-ui-sortable
【解决方案1】:
丹尼尔,
这是一个已知问题,我已经设法使用 ng-include 解决了这个问题,因此 tinymce textarea 将包含在其中。
像这样:
<ul ui-sortable="sortableOptions" ng-model="appData.data">
<li ng-repeat="box in appData.data" boxlistitem ng-include src="box.template_name">
</li>
</ul>
<script type="text/ng-template" id="tinymce_module">
<textarea ng-model="box.title" value="{{box.title}}" class="tinyMCE" ui-tinymce="tinymceOptions"></textarea>
</script>
在控制器中你需要做这样的事情:
$scope.sortableOptions =
update: (e, ui) ->
box.template_name = ""
$timeout ->
box.template_name = "tinymce_module"
,0
只需找到将 {{box}} 传递给 sortableOptions 中的更新函数的方法,它将重新加载 tinymce 插件及其所有数据。
祝你好运。