Not able to use angular-json-editor and ng-jsoneditor together

[amanguptadev]

Hey,

I'm stuck into a problem,
angular-json-editor and ng-json-editor both are using a json-editor.js file, so i'm facing some conflict problem and not able to solve issue by my self.

<json-editor schema="deviceSh" startval="deviceValSh" buttons-controller="addDeviceED1Ctrl" id='editor_holder'>
        </json-editor>

The directive above is loading ng-json-editor not angular-json-editor.

[rodikh]

Hey,

Can you explain more about your use case?
What is ng-jsoneditor, and what is it's use?

I am not sure how Angular handles multiple directives with the same name, so it might be overwriting my directive with ng-jsoneditor's definition.

[shatting]

had the same problem. the problem is that both json editors use window.JSONEditor. i ended up renaming one and slightly costumizing the angular wrapper around https://github.com/angular-tools/ng-jsoneditor (i called it /ng-json-tree-editor.js, its a very short file, just replace new JSONEditor by whatever you chose to name it, new JSONTreeEditor in my case. i also renamed the directive to <ng-json-tree-editor>)

        <!-- this is https://github.com/josdejong/jsoneditor, and will be exposed as window.JSONTreeEditor -->
        <script src="bower_components/jsoneditor/dist/jsoneditor.min.js"></script>
        <script type="text/javascript">
            window.JSONTreeEditor = window.JSONEditor
            delete window.JSONEditor
        </script>
        <!-- this is a wrapper around the above, directive called <ng-json-tree-editor> -->
        <script src="/ng-json-tree-editor.js"></script>
        <!--this is https://github.com/jdorn/json-editor, and will be exposed as window.JSONEditor-->
        <script src="bower_components/json-editor/dist/jsoneditor.js"></script>
        <!--wrapper around the above (https://github.com/rodikh/angular-json-editor), directive called <json-editor> -->
        <script src="bower_components/angular-json-editor/dist/angular-json-editor.js"></script>