Strange looking at JSON using ng-jsoneditor in AngularJS
I am using ng-jsoneditor
AngularJSapplication to display and format JSON data. Follow this and this article.
HTML:
<div ng-jsoneditor="onLoad"
ng-model="vm.obj.data"
options="vm.obj.options"
style="width: 400px; height: 300px;">
</div>
JS:
vm.json = {
"Array": [1, 2, 3],
"Boolean": true,
"Null": null,
"Number": 123,
"Object": {
"a": "b",
"c": "d"
},
"String": "Hello World"
};
vm.obj = {
data: vm.json,
options: {
mode: 'tree'
}
};
$scope.onLoad = function (instance) {
instance.expandAll();
};
The result looks like this:
+3
Umair jameel
source
to share
1 answer
You forgot to include files CSS
in your project. This scripted demo contains a CSS file.
<link rel="stylesheet" href="//cdn.rawgit.com/josdejong/jsoneditor/master/dist/jsoneditor.min.css">
+1
lin
source
to share