codemirror命令详解及使用

最新推荐文章于 2024-04-26 10:04:25 发布

weixin_33713350

最新推荐文章于 2024-04-26 10:04:25 发布

阅读量2.5k

点赞数 1

文章标签： shell javascript ui ViewUI

原文链接：https://my.oschina.net/u/2391658/blog/789632

版权

2019独角兽企业重金招聘Python工程师标准>>>

创建codemirror对象：

var myCodeMirror = CodeMirror(document.body, {
  value: "function myScript(){return 100;}\n",
  mode:  "javascript"
});

命令使用方法示例：

//以下命令的作用是将滚动条置于文本区最下方
codemirror.execCommand("goDocEnd");

如果与angularjs的ui-codemirror模块集成，需要将光标或滚动条置于文本最下方时，则需要在ui-codemirror.js文件中增加命令：

  function configNgModelLink(codemirror, ngModel, scope) {
    if (!ngModel) { return; }
    // CodeMirror expects a string, so make sure it gets one.
    // This does not change the model.
    ngModel.$formatters.push(function(value) {
      if (angular.isUndefined(value) || value === null) {
        return '';
      } else if (angular.isObject(value) || angular.isArray(value)) {
        throw new Error('ui-codemirror cannot use an object or an array as a model');
      }
      return value;
    });


    // Override the ngModelController $render method, which is what gets called when the model is updated.
    // This takes care of the synchronizing the codeMirror element with the underlying model, in the case that it is changed by something else.
    ngModel.$render = function() {
      //Code mirror expects a string so make sure it gets one
      //Although the formatter have already done this, it can be possible that another formatter returns undefined (for example the required directive)
      var safeViewValue = ngModel.$viewValue || '';
      codemirror.setValue(safeViewValue);
      codemirror.execCommand("goDocEnd"); //将光标和滚动条设置到文本区最下方
    };


    // Keep the ngModel in sync with changes from CodeMirror
    codemirror.on('change', function(instance) {
      var newValue = instance.getValue();
      if (newValue !== ngModel.$viewValue) {
        scope.$evalAsync(function() {
          ngModel.$setViewValue(newValue);
          codemirror.execCommand("goDocEnd");//将光标和滚动条设置到文本区最下方
        });
      }
    });
  }

其他命令如下，加粗字体命令的均可直接使用：

selectAllCtrl-A (PC), Cmd-A (Mac)

Select the whole content of the editor.

singleSelectionEsc

When multiple selections are present, this deselects all but the primary selection.

killLineCtrl-K (Mac)

Emacs-style line killing. Deletes the part of the line after the cursor. If that consists only of whitespace, the newline at the end of the line is also deleted.

deleteLineCtrl-D (PC), Cmd-D (Mac)

Deletes the whole line under the cursor, including newline at the end.

delLineLeft

Delete the part of the line before the cursor.

delWrappedLineLeftCmd-Backspace (Mac)

Delete the part of the line from the left side of the visual line the cursor is on to the cursor.

delWrappedLineRightCmd-Delete (Mac)

Delete the part of the line from the cursor to the right side of the visual line the cursor is on.

undoCtrl-Z (PC), Cmd-Z (Mac)

Undo the last change.

redoCtrl-Y (PC), Shift-Cmd-Z (Mac), Cmd-Y (Mac)

Redo the last undone change.

undoSelectionCtrl-U (PC), Cmd-U (Mac)

Undo the last change to the selection, or if there are no selection-only changes at the top of the history, undo the last change.

redoSelectionAlt-U (PC), Shift-Cmd-U (Mac)

Redo the last change to the selection, or the last text change if no selection changes remain.

goDocStartCtrl-Home (PC), Cmd-Up (Mac), Cmd-Home (Mac)

Move the cursor to the start of the document.

goDocEndCtrl-End (PC), Cmd-End (Mac), Cmd-Down (Mac)

Move the cursor to the end of the document.

goLineStartAlt-Left (PC), Ctrl-A (Mac)

Move the cursor to the start of the line.

goLineStartSmartHome

Move to the start of the text on the line, or if we are already there, to the actual start of the line (including whitespace).

goLineEndAlt-Right (PC), Ctrl-E (Mac)

Move the cursor to the end of the line.

goLineRightCmd-Right (Mac)

Move the cursor to the right side of the visual line it is on.

goLineLeftCmd-Left (Mac)

Move the cursor to the left side of the visual line it is on. If this line is wrapped, that may not be the start of the line.

goLineLeftSmart

Move the cursor to the left side of the visual line it is on. If that takes it to the start of the line, behave like goLineStartSmart.

goLineUpUp, Ctrl-P (Mac)

Move the cursor up one line.

goLineDownDown, Ctrl-N (Mac)

Move down one line.

goPageUpPageUp, Shift-Ctrl-V (Mac)

Move the cursor up one screen, and scroll up by the same distance.

goPageDownPageDown, Ctrl-V (Mac)

Move the cursor down one screen, and scroll down by the same distance.

goCharLeftLeft, Ctrl-B (Mac)

Move the cursor one character left, going to the previous line when hitting the start of line.

goCharRightRight, Ctrl-F (Mac)

Move the cursor one character right, going to the next line when hitting the end of line.

goColumnLeft

Move the cursor one character left, but don't cross line boundaries.

goColumnRight

Move the cursor one character right, don't cross line boundaries.

goWordLeftAlt-B (Mac)

Move the cursor to the start of the previous word.

goWordRightAlt-F (Mac)

Move the cursor to the end of the next word.

goGroupLeftCtrl-Left (PC), Alt-Left (Mac)

Move to the left of the group before the cursor. A group is a stretch of word characters, a stretch of punctuation characters, a newline, or a stretch of more than one whitespace character.

goGroupRightCtrl-Right (PC), Alt-Right (Mac)

Move to the right of the group after the cursor (see above).

delCharBeforeShift-Backspace, Ctrl-H (Mac)

Delete the character before the cursor.

delCharAfterDelete, Ctrl-D (Mac)

Delete the character after the cursor.

delWordBeforeAlt-Backspace (Mac)

Delete up to the start of the word before the cursor.

delWordAfterAlt-D (Mac)

Delete up to the end of the word after the cursor.

delGroupBeforeCtrl-Backspace (PC), Alt-Backspace (Mac)

Delete to the left of the group before the cursor.