调整 CK 编辑器大小的 Javascript 不起作用

Question

我正在使用 javascript ckEditor，我遇到了一个调整大小的问题，这在过去几天一直困扰着我。我有一个名为 ckEditorConfig 的 Angular 对象，我在其中存储我的 ckEditor 的配置。目前我可以看到正在设置一些属性(所以我知道它在某种程度上起作用)。但是，当我尝试调整编辑器大小时，它并没有调整到我想要的级别。

以下是 html 和 js 代码的片段，可以为我正在谈论的内容增添更多亮点:

• 这包含在我的 Controller 中

  $scope.ckEditorConfig = {
      uiColor : '#FFFFFF',
      toolbarGroups: [
          { name: 'undo' }
      ],
  
      removeButtons: '',
      extraPlugins: 'font,sourcedialog,sourcearea,stylescombo,colorbutton, colordialog',
      contentsCss: '/path/to/css',
      customConfig: '/path/to/js',
      width: 561,
      height: 150
  };
  
  
   websiteApp.directive('ckEditor', ['$timeout', function ($timeout) {
  return {
      require: '?ngModel',
      link: function ($scope, elm, attr, ngModel) {
          var ck = CKEDITOR.replace(elm[0]);
          if($scope.ckEditorConfig){
              $.each($scope.ckEditorConfig, function(key, value){
                  ck.config[key] = value;
              });
          }
  
          var height = ck.config.height; var width = ck.config.width;
          if(height && width){
              ck.on('instanceReady', function(event){
                  var editor = event.editor;
                  console.log('ck height: '+ height+', ck width: '+width);
                  console.log('editor config height: '+ editor.config.height+', editor config width: '+editor.config.width);
                  editor.resize(editor.config.width, editor.config.height, false, false);
              });
              // ck.resize(height, width, true, false);
          }
      }
  };
  

  }]);

我的 html 中有这个

> <textarea id="fflFieldLabel" class="txtArea" rows="1"
> ng-model="{{ngmodel}}" ck-editor></textarea>

Answer 1

如果您使用 config.width和 config.height没有必要打电话 editor.resize , 大小应该在初始化时由编辑器本身根据配置自动设置。

它适用于

<textarea name="editor1" id="editor1" rows="1" cols="80">  
    <p>Foo Bar Baz</p>
</textarea>

和

CKEDITOR.replace( 'editor1', { width: 450, height: 150 } );

所以可能存在一些集成问题，或者维度在其他地方被覆盖/更新了？