如何将Json数据动态绑定到ACE编辑器

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

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

然而，王牌编辑字符串化需要JSON数据，并抛出以下错误：

"Error: ui-ace cannot use an object or an array as a model

，如果我字符串化数据第一，然后我怎么能找出与NG-另一方面重复？那么，如何解决这个问题呢？任何帮助，将不胜感激。

例子：

[ 
    {       // 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" 
    } 
]

来源

2016-11-27 Dozent

我不清楚您遇到什么问题，都不过是我能够放在一起，似乎你要寻找的演示：

<div ng-repeat="item in aceModel"> 
    <div ui-ace="aceOption" ng-model="item"></div> 
</div>

和Controller：

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

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

编辑

我和你的JSON更新普拉克并将其推入$scope.aceModel

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)); 
    });

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

来源

2016-11-27 22:31:31

@K Scandret，感谢响应。我的想法是，我的Json以数组的形式出现，即一组json数据，这些数据将在不同的编辑器中用ng-repeat迭代。问题是无法将Json绑定到编辑器（Ace Library），因为它接受字符串化的Json，而不是错误中显示的对象或数组。 – Dozent

用json数据更新了plunker。你是这个意思吗？ –

如何将Json数据动态绑定到ACE编辑器

回答

相关问题