錯誤：uiCodemirror3只能應用於textarea元素

Question

根據ui-codemirror的文檔：

ui-codemirror指令可與ng-model很好地配合使用。

將監視ng-model來設置CodeMirror文檔值（通過setValue）。

ui-codemirror指令存儲並期望模型值是標准javascript字符串。

但是，我的以下代碼（ JSBin ）返回錯誤Error: uiCodemirror3 can only be applied to a textarea element控制台中Error: uiCodemirror3 can only be applied to a textarea element 。

<html ng-app="flapperNews">
<head>
  <link rel="stylesheet" href="https://codemirror.net/lib/codemirror.css">
  <script src="https://code.jquery.com/jquery.min.js"></script>
  <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.7/angular.min.js"></script>
  <script src="https://codemirror.net/lib/codemirror.js"></script>
  <script src="https://codemirror.net/mode/xml/xml.js"></script>
  <script src="https://codemirror.net/mode/htmlmixed/htmlmixed.js"></script>
  <script src="https://codemirror.net/mode/javascript/javascript.js"></script>
  <script src="https://cdnjs.cloudflare.com/ajax/libs/angular-ui/0.4.0/angular-ui.js"></script>
  <script>
    var app = angular.module('flapperNews', ['ui']);
    app.controller('MainCtrl', ['$scope', function ($scope) {
      $scope.x = "<html><body>abc</body></html>";
    }])
  </script>
</head>
<body ng-controller="MainCtrl">
  <div ui-codemirror ng-model="x"></div>
</body>
</html>

有誰知道如何正確使用ui-codemirror 指令？

Answer 1

只需將div替換為textarea如以下代碼（ jsbin ）

<textarea ui-codemirror ng-model="x"></textarea>

您可以在https://cdnjs.cloudflare.com/ajax/libs/angular-ui/0.4.0/angular-ui.js中找到錯誤消息，但https://github.com/angular-ui/ui-codemirror /blob/master/src/ui-codemirror.js沒有。

因此，您可以等待angular-ui更新它，或者單獨使用ui-codemirror進行最后更改。

Answer 2

您可以添加以下庫

<script src="https://cdnjs.cloudflare.com/ajax/libs/angular-ui-codemirror/0.3.0/ui-codemirror.js"></script>

並刪除以下內容

<script src="https://cdnjs.cloudflare.com/ajax/libs/angular-ui/0.4.0/angular-ui.js"></script>

angular-ui.js具有舊的codemirror指令

並注入

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

示例JSBin

錯誤：uiCodemirror3只能應用於textarea元素

問題描述

2 個解決方案

解決方案1
0 2017-02-18 09:08:26

解決方案2
0 已采納 2017-02-18 14:22:23

錯誤：uiCodemirror3只能應用於textarea元素

問題描述

2 個解決方案

解決方案1 0 2017-02-18 09:08:26

解決方案2 0 已采納 2017-02-18 14:22:23

解決方案1
0 2017-02-18 09:08:26

解決方案2
0 已采納 2017-02-18 14:22:23