使用AngularJs在自定义TinyMCE编辑器中添加动态数据
Dynamic data added in custom TinyMCE Editor using AngularJs
我使用的是anglarjs TinyMCE编辑器,https://www.tinymce.com/docs/integrations/angularjs/,在这里,我在工具箱中添加了自定义下拉按钮,当我使用静态值时,它工作得很好,但实际上我不知道如何在这个下拉列表中加载动态数据值。
setup : function ( editor ) {
editor.addButton( 'customDrpdwn', {
text : 'Customers List',
type: 'menubutton',
icon : false,
menu: [
{
text: 'Customer 1',
onclick: function(){
alert("Clicked on Customer 1");
}
},
{
text: 'Customer 2',
onclick: function(){
alert("Clicked on Customer 2");
}
}
]
});
},
};
我试着在菜单文本字段中加载动态值,但我遇到了错误。动态加载我的代码后,像这样-
$scope.customerList = ['Customer 1','Customer 2'];
setup : function ( editor ) {
editor.addButton( 'customDrpdwn', {
text : 'Customers List',
type: 'menubutton',
icon : false,
for(var i =0; i< $scope.customerList.length; i++){
menu: [
{
text: $scope.customerList[i],
onclick: function(){
alert("Clicked on Customer 1");
}
}
]
}
});
}
现在,我的问题是,在这个自定义字段中加载动态数据是可能的。如果是,那么我如何动态加载数据?请帮帮我。
这里有一种方法:
$scope.customerList = ['Customer 1','Customer 2'];
// first make all the menu items
var menuItems = [];
$scope.customerList.forEach(function(customer, index){
item = {
'text': customer,
onclick: function(){
alert("Clicked on " + customer);
}
};
menuItems.push(item);
});
$scope.tinymceOptions = {
plugins: 'link image code',
toolbar: 'undo redo | bold italic | alignleft aligncenter alignright | code | customDrpdwn',
setup: function(editor){
editor.addButton( 'customDrpdwn', {
text : 'Customers List',
type: 'menubutton',
icon : false,
menu: menuItems // then just add it here
});
}
};
相关文章:
- 正在添加动态第二类Jquery
- 如何在javascript而不是jquery中添加动态列表
- 为图例添加动态色彩标签
- 如何在谷歌表单中添加动态字段
- 如何添加动态Id's并在运行时提取它们
- 在 JavaScript 中添加动态文本
- 如何添加动态表单元素但保留其值(JS)
- 使用AngularJs在自定义TinyMCE编辑器中添加动态数据
- 如何使用JavaScript添加动态HTML内容(DIV)
- javascript初学者:在javascript中添加动态样式
- 如何使用Javascript在html源中添加动态数据
- 向Uploadify添加动态字段
- 如何在 Vue.js 中添加动态组件/部件
- 锚导航与坚持到顶部菜单..需要向锚点添加动态偏移量
- Javascript:添加动态方法
- 向角度对象添加动态功能
- 添加动态文本框时更新动态高度
- JavaScript 运行时错误:无法在 Windows 8 应用中添加动态内容
- 添加动态点击事件
- 添加动态字段以创建特定的 JSON 格式