流星- Ckeditor积分
我不确定Meteor加载条目的方式是否发生了变化，或者它处理jquery的方式发生了变化，但是我在让ckeditor出现时遇到了很大的困难。
主要模板(铁-路由器)：
<template name="layout">
<head>
<script type="text/javascript" src="js/ckeditor/ckeditor.js"></script>
<script type="text/javascript" src="js/ckeditor/adapters/jquery.js"></script>
</head>
.....
</template>独立编辑模板：
<template name="editor">
<div class="editor_container">
<textarea class="editor"></textarea>
</div>
</template>位于public/js/ckeditor的Ckeditor，每当我尝试执行Template.editor.rendered()技术，甚至尝试在控制台中键入$('.editor').ckeditor();时，我都会得到以下错误：
$('.editor').ckeditor();
VM48825:2 Uncaught TypeError: undefined is not a function有什么想法吗？
回答 3
Stack Overflow用户
发布于 2015-03-04 03:59:08
尝试将<head>部分从布局模板中删除。在这里阅读，我相信<head>部分被专门处理为流星(参见：http://docs.meteor.com/#/full/structuringyourapp)，它在模板中可能导致JS实际上没有被加载。不过，只是猜测一下。
<head>
<script type="text/javascript" src="js/ckeditor/ckeditor.js"></script>
<script type="text/javascript" src="js/ckeditor/adapters/jquery.js"></script>
</head>
<template name="layout">
.....
</template>Stack Overflow用户
发布于 2015-03-04 04:16:33
您可以像这样将IRLibLoader从iron:router使用到onBeforeAction中。
Router.route('/editor', {
name: 'editor',
template: 'layout',
onBeforeAction: function () {
var ckEditor = IRLibLoader.load('/js/ckeditor/ckeditor.js');
var adapter = IRLibLoader.load('/js/ckeditor/adapters/jquery.js');
if(ckEditor.ready() && adapter.ready()){
console.log('The 2 JS just finish load');
this.next(); // Render the editor page
if(Meteor.isClient){
Template.editor.rendered = function(){
$('.editor').ckeditor();
console.log("loading coeditor when template fully rendered");
}
}
}
}
});在主layout上可以使用此选项。
<head>
<script type="text/javascript" src="js/ckeditor/ckeditor.js"></script>
<script type="text/javascript" src="js/ckeditor/adapters/jquery.js"></script>
</head>
<template name="layout">
{{> yield}}
</template>
<template name="editor">
<div class="editor_container">
<textarea class="editor"></textarea>
</div>
</template>并执行相同的呈现函数
Template.editor.rendered = function(){
$('.editor').ckeditor();
//or make a little delay (1sec)
Meteor.setTiemout(function(){
$('.editor').ckeditor();
},100)
}Stack Overflow用户
发布于 2015-03-04 04:04:54
您的代码有几个问题：
- 不能将
<head>部分放入另一个模板中，必须在所有模板之外执行。 - JS文件的路径被破坏了，您必须在它们前面加上一个斜杠，以引用公共目录中的文件。
- 在
<head>部分加载脚本不是一个好主意，因为当应用程序首次为每个用户加载脚本时，它们将被加载，即使它们从未使用编辑器。
这里有一个解决方案，在呈现编辑器模板时，我们使用jQuery承诺异步加载每个脚本，然后才初始化CKEditor。
Template.editor.rendered=function(){
var template=this;
$.when(
$.getScript("/js/ckeditor/ckeditor.js"),
$.getScript("/js/ckeditor/adapters/jquery.js")
).done(function(){
template.$(".editor").ckeditor();
});
};https://stackoverflow.com/questions/28846373
复制相似问题
腾讯云开发者
Copyright © 2013 - 2026 Tencent Cloud. All Rights Reserved. 腾讯云 版权所有
深圳市腾讯计算机系统有限公司 ICP备案/许可证号：粤B2-20090059 
粤公网安备44030502008569号
腾讯云计算（北京）有限责任公司 京ICP证150476号 | 京ICP备11018762号