Skip to content

Option "change" has been renamed to "onChange" #27

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
wants to merge 4 commits into
base: master
Choose a base branch
from
Open

Option "change" has been renamed to "onChange" #27

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
4 commits
Select commit Hold shift + click to select a range
b7afbf1
Local demo
Aug 9, 2017
668895d
Minification process
Aug 9, 2017
7492779
change event to onChange
Aug 9, 2017
3ec1d4e
Readme fix
Aug 9, 2017
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
10 changes: 9 additions & 1 deletion README.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -47,12 +47,16 @@ Finally, add the directive to your html:

http://jsfiddle.net/angulartools/sd3at5ek/

## Local Demo

Run `npm install` to install the local server, then `npm start` to start it. Then visit `http://localhost:1112/demo/`

### Sample code

```javascript
myAppModule.controller('MyController', [ '$scope', function($scope) {
$scope.obj = {data: json, options: { mode: 'tree' }};

$scope.btnClick = function() {
$scope.obj.options.mode = 'code'; //should switch you to code view
}
Expand Down Expand Up @@ -99,6 +103,10 @@ myAppModule.controller('MyController', [ '$scope', function($scope) {
}]);
```

### Development

To minify the source file, run `npm install` to install the *uglify-js* module, then run `npm run minify`

### Contributors

- Sanchit Bhatnagar
Expand Down
55 changes: 55 additions & 0 deletions demo/index.html
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,55 @@
<!doctype html>
<html>

<head>

<meta charset="UTF-8">
<title>ng-jsoneditor demo</title>

<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/jsoneditor/5.9.3/jsoneditor.min.css">

</head>

<body ng-app="app" ng-controller="pageCtrl">

<div ng-jsoneditor="onLoad" ng-model="obj.data" options="obj.options" style="width: 400px; height: 300px;"></div>

<button type="button" class="btn btn-primary" ng-click="changeData()"><i class="fa fa-check-circle"></i> change data</button>

<button type="button" class="btn btn-primary" ng-click="changeOptions()"><i class="fa fa-check-circle"></i> change options</button>

<pre>{{pretty(obj.data)}}</pre>

<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.6.5/angular.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jsoneditor/5.9.3/jsoneditor.min.js"></script>
<script src="../ng-jsoneditor.min.js"></script>
<script>

var json = {"Array": [1, 2, 3], "Boolean": true, "Null": null, "Number": 123, "Object": {"a": "b", "c": "d"}, "String": "Hello World"};

var app = angular.module('app', ['ng.jsoneditor']);

app.controller('pageCtrl', ['$scope', function ($scope) {

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

//other
$scope.pretty = function (obj) {
return angular.toJson(obj, true);
}

}]);

</script>

</body>
</html>
2 changes: 1 addition & 1 deletion ng-jsoneditor.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -21,7 +21,7 @@
function _createEditor(options) {
var settings = angular.extend({}, defaults, options);
var theOptions = angular.extend({}, settings, {
change: function () {
onChange: function () {
if (typeof debounceTo !== 'undefined') {
$timeout.cancel(debounceTo);
}
Expand Down
2 changes: 1 addition & 1 deletion ng-jsoneditor.min.js
View file
Open in desktop

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

9 changes: 8 additions & 1 deletion package.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -9,8 +9,15 @@
"peerDependencies": {
"jsoneditor": "^5.5.6"
},
"scripts": {
"start": "http-server -a localhost -p 1112",
"minify": "uglifyjs ng-jsoneditor.js -o ng-jsoneditor.min.js"
},
"description": "Angular version of the insanely cool jsoneditor",
"devDependencies": {},
"devDependencies": {
"http-server": "~0.8.0",
"uglify-js": "^3.0.27"
},
"directories": {},
"homepage": "https://github.com/angular-tools/ng-jsoneditor",
"keywords": [
Expand Down