如何使用 angularjs 编辑和验证 JSON 数据？

Question

我成功地从dropdown 中的textarea 中获取并显示所选文件的json 数据。现在我的要求是我想使用angularjs(ng-jsoneditor) 或任何other libraries/tools 来编辑textarea 中所选文件的json 数据以进行验证。我已经尝试了以下方法，但我无法使其正常工作或与此或任何其他libraries 集成，以按预期编辑内容：默认为object {0} (empty object) 或单击change options 按钮。

我关注this。

我在Plnkr中创建了上面的代码。

Answer 1

你需要直接向作用域声明“obj”对象

app.controller('MainCtrl', function($scope,$http) {

    $scope.JSONFiles = [];
    $scope.obj = {data: '', options: { mode: 'tree' }}; 

    $http.get("test1.json").success(function (response) {
      $scope.JSONFiles.push(response);
    });
    $http.get("test2.json").success(function (response) {
       $scope.JSONFiles.push(response);
    });

    $scope.selectedjson ="";
    $scope.textAreaData = "";
    $scope.optionChanged = function(){
      $scope.textAreaData = $scope.selectedjson;
     // alert($scope.textAreaData);//gives selected file json data
      // code to implement json-editor

       $scope.obj = {data: $scope.textAreaData, options: {mode: 'tree'}};
            $scope.onLoad = function (instance) {
                instance.expandAll();
            };
            $scope.changeOptions = function () {
                $scope.obj.options.mode = $scope.obj.options.mode == 'tree' ? 'code' : 'tree';
            };
    };

});

Here's 工作中的 Plnkr。
文档中的示例还显示了this