如何將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編輯器

回答

相關問題