Question

我创建了一个基于AngularJS的应用程序，它通过UI.Ace directive为Json嵌入了Ace编辑器。该应用程序将基于动态Json数据创建一组编辑器，即每个编辑器都具有包含Json对象的ng-model。这是模型：

<div ng-repeat="item in items">
    <div ui-ace="aceOptions" ng-model="item" style="height: 200px"></div>
</div>

但是，Ace编辑器需要字符串化的Json数据并抛出以下错误：

＆＃34;错误：ui-ace不能将对象或数组用作模型

另一方面，如果我首先对数据进行字符串化，那么我如何能够找出ng-repeat？那么，如何才能解决这个问题呢？任何帮助将不胜感激。

示例：

[
    {                           // goes to editor one
        "id": "14",
        "firstName": "John",
        "lastName": "Doe"
    },
    {                           // goes to editor two
        "id": "45",
        "firstName": "Bob",
        "lastName": "Smith"
    },
    {                           // goes to editor three
        "id": "98",
        "firstName": "Jack",
        "lastName": "White"
    }
]

Answer 1

我不确切地知道您遇到了什么问题，但我能够整理一个看起来像您正在寻找的演示：

$scope.aceModel = [];
$scope.aceModel[0] = ';; Scheme code in here.\n' + ...
$scope.aceModel[1] = ';; Different code here for the new editor.\n' + ...

在控制器中：

$scope.aceModel

示例：http://plnkr.co/edit/1KlmqopkmbhvKuMy4he2?p=preview

修改

我已经用你的json更新了Plunk并将其推到了var jsonData = [{ // goes to editor one "id": "14", "firstName": "John", "lastName": "Doe" }, { // goes to editor two "id": "45", "firstName": "Bob", "lastName": "Smith" }, { // goes to editor three "id": "98", "firstName": "Jack", "lastName": "White" }]; $scope.aceModel = []; angular.forEach(jsonData, function(value, key) { $scope.aceModel.push(JSON.stringify(value, null, 4)); });

<button type="button" a href="#dos">CONOCÉ SOBRE SU VIDA</button>

http://plnkr.co/edit/1KlmqopkmbhvKuMy4he2?p=preview

如何将Json数据动态绑定到ACE Editor

1 个答案: