この問題の解決策を使用する: Ckeditor の値を angularjs および rails のモデル テキストにバインドする
ページでディレクティブを使用しようとすると、次のエラーが発生します。
Uncaught TypeError: Cannot call method 'unselectable' of null ckeditor.js:290
a ckeditor.js:290
(anonymous function) ckeditor.js:286
i ckeditor.js:10
CKEDITOR.event.CKEDITOR.event.fire ckeditor.js:12
CKEDITOR.editor.CKEDITOR.editor.fire ckeditor.js:13
CKEDITOR.event.CKEDITOR.event.fireOnce ckeditor.js:12
CKEDITOR.editor.CKEDITOR.editor.fireOnce ckeditor.js:13
(anonymous function) ckeditor.js:222
n ckeditor.js:202
CKEDITOR.scriptLoader.load ckeditor.js:202
(anonymous function) ckeditor.js:221
(anonymous function) ckeditor.js:209
(anonymous function) ckeditor.js:207
n ckeditor.js:202
CKEDITOR.scriptLoader.load ckeditor.js:202
CKEDITOR.resourceManager.load ckeditor.js:206
f ckeditor.js:208
(anonymous function) ckeditor.js:209
n ckeditor.js:219
(anonymous function) ckeditor.js:219
(anonymous function) ckeditor.js:396
(anonymous function) ckeditor.js:207
n ckeditor.js:202
o ckeditor.js:202
q ckeditor.js:202
(anonymous function)
次のディレクティブを使用しています
var app = angular.module('Tutorial', [])
.config(function($routeProvider, $locationProvider) {
$routeProvider
.when(/*routes like this */)
.otherwise({ redirectTo: '/' })
})
app.directive('ckEditor', function() {
return {
require: '?ngModel',
link: function(scope, elm, attr, ngModel) {
var ck = CKEDITOR.replace(elm[0]);
if (!ngModel) return;
ck.on('pasteState', function() {
scope.$apply(function() {
ngModel.$setViewValue(ck.getData());
});
});
ngModel.$render = function(value) {
ck.setData(ngModel.$viewValue);
};
}
};
});
それから私のページに私は持っています
<script src="/javascripts/ckeditor/ckeditor.js"></script>
と
<textarea ck-editor ng-model="variableName"></textarea>
angular と ckeditor は初めてなので、ここで何が起こっているのかよくわかりません。エディターをページに配置し、モデルにバインドするだけです。このエラーの原因を誰かが知っていれば、大いに役立ちます。
ありがとう。
更新:@szaがフィドルが機能したとコメントした後、実際にはコード内の別のものであることを確認しました。
壊れたページへのリンクを別のページに追加して、問題のあるページに簡単に移動できるようにし、エディターが正しく読み込まれるようにしました。
onclick="location.href="/#/controller/view""
ただし、URL を介してその場所に直接移動するたびに、エディターが機能しません。