Angular.js中的ckeditor拋出錯誤

Question

我正在使用ckeditor編輯內容，我注入了模塊，還鏈接了ckeditor所需的所有文件，但是它拋出諸如TypeError: this[a] is undefined的error TypeError: this[a] is undefined ，我是Angular的新手，我沒有得到任何我自己的適當解決方案。

有人可以幫我為什么我會收到此error嗎？

這是我的代碼

app.controller('editAboutUsCtrl', function ($scope) {
    $scope.editorOptions = {
                language: 'eu'
               // uiColor: '#000000'
            };
            $scope.$on("ckeditor.ready", function( event ) {
                $scope.isReady = true;
            });
});  

這是我的HTML

<div ng-controller="editAboutUsCtrl">
    <div ng-cloak ng-hide="isReady" class="highlight">
          Initialising ...
      </div>

      <div ng-cloak ng-show="isReady">
         <textarea ckeditor="editorOptions" name="editor" ng-model="aboutUsContent"></textarea>
       </div>
</div>

Answer 1

關於Angularjs的一些事情

請參閱您喜歡的樣式指南，但是，如果您不遵循一種樣式指南，那么這里是一份。

風格指南鏈接

您的控制器名稱將變為EditAboutUsCtrl。

我認為您不需要ng-斗篷。 該指令將隱藏該元素，直到其所有信息都被隱藏為止。 在您的情況下，您正在使用ng-hide和ng-show。

您的ng模型應該是某種類型的對象，而不是原始的對象。 原始：“ hello ckEditor”對象：var aboutUsContent = {};

如果需要name參數，只知道它與表單名稱ex一起使用。

然后，您可以調用$ scope.myForm.editor。$ valid？

回到您的問題。 我在網上找到的示例使用指令。 您沒有在代碼中包含示例，但是我假設ckeditor =“ editorOptions”是您的指令。

因此，請確保它遵循此示例。

使用angularjs鏈接到ckeditor的示例

文章結尾有兩個jsfiddle示例。 這是一個非常簡單的鏈接，也許您可​​以立即使用。

嘗試這個

<div data-ng-app="app" data-ng-controller="myCtrl">

<h3>CKEditor 4.2:</h3>
  <div ng-repeat="editor in ckEditors">
    <textarea data-ng-model="editor.value" data-ck-editor></textarea>
    <br />
  </div>
  <button ng-click="addEditor()">New Editor</button>
</div>

var app = angular.module('app', []);

app.directive('ckEditor', [function () {
  return {
    require: '?ngModel',
    link: function ($scope, elm, attr, ngModel) {

        var ck = CKEDITOR.replace(elm[0]);

        ck.on('pasteState', function () {
            $scope.$apply(function () {
                ngModel.$setViewValue(ck.getData());
            });
        });

        ngModel.$render = function (value) {
            ck.setData(ngModel.$modelValue);
        };
    }
  };
}])

function myCtrl($scope){
  $scope.ckEditors = [];
  $scope.addEditor = function(){
    var rand = ""+(Math.random() * 10000);
    $scope.ckEditors.push({value:rand});
  }
}