错误：uiCodemirror3只能应用于textarea元素 [英] Error: uiCodemirror3 can only be applied to a textarea element
问题描述
根据 ui-codemirror 的文档：
ui-codemirror指令可与ng-model很好地配合。
The ui-codemirror directive plays nicely with ng-model.
将监视ng-model来设置CodeMirror文档值（
The ng-model will be watched for to set the CodeMirror document value (by setValue).
ui-codemirror指令存储并期望模型值是标准的JavaScript字符串。
The ui-codemirror directive stores and expects the model value to be a standard javascript String.
但是，我的以下代码（ JSBin ）返回错误错误：uiCodemirror3只能应用于控制台中的textarea元素。
However, my following code (JSBin) returns an error Error: uiCodemirror3 can only be applied to a textarea element in the console.
<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 指令吗？
Does anyone know how to correctly use ui-codemirror directive?
推荐答案
您可以添加以下库
<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具有旧的代码镜像指令
angular-ui.js has old codemirror directives
然后注入
var app = angular.module('flapperNews', ['ui.codemirror']);
示例 JSBin
这篇关于错误：uiCodemirror3只能应用于textarea元素的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
