AngularJS JSON_CALLBACK not working with ng-repeat
I'm trying to make a ng-clickable menu using ng-repeat. I use ngResource
to call a rest server. When my menu is done in pure html (ul/li),
everything works well but when done with ng-repeat, the data set by the
callback is not updated in the HTML view.
Maybe a simple example will be more clear :
simple button is working
html menu is working
ng-repeat the call to the server is done but nothing happens
did I miss something ?
Thanks in advance
ps : i tried to make a jsfiddle but i couldn't make it work...
html page :
<!doctype html> <html>
<head>
<script src="http://code.angularjs.org/1.0.7/angular.min.js"></script>
<script
src="http://code.angularjs.org/1.0.7/angular-resource.min.js"></script>
<script src="js/date.js"></script>
</head>
<body>
<div ng-app="App">
<div ng-controller="Controller">
<h1>{{ date.time }}</h1>
<h1>{{ date.milliseconds_since_epoch }}</h1>
<hr>
<button ng-click="fetchDate()">fetch</button>
<hr>
<div><ul><li><a>html menu</a>
<ul><li><button
ng-click="fetchDate()">fetch</button></li></ul>
</li>
</ul>
</div>
<hr>
<div><ul><li ng-repeat="menuItem in
menu.menuItems"><a>{{menuItem.label}}</a>
<ul><li ng-repeat="subMenuItem in menuItem.subMenuItems">
<button ng-click="fetchDate()">fetch</button>
</li>
</ul>
</li>
</ul>
</div>
</div>
</div>
</body>
</html>
angular controller (date.js) :
angular.module('App', ['ngResource']);
Controller = function ($scope, $resource) {
$scope.menu = {'menuItems': [
{'label': 'menu1', 'subMenuItems': [
{'label': 'sub1'}
,
{'label': 'sub2'}
]
}
,
{'label': 'menu2', 'subMenuItems': [
{'label': 'sub1'}
,
{'label': 'sub2'}
]
}
]
};
$scope.Date = $resource('http://date.jsontest.com/', {
alt: 'jsonp',
callback: 'JSON_CALLBACK'
}, {
get: {
method: 'JSONP'
}
}
);
$scope.fetchDate = function () {
this.date = this.Date.get();
};
};
No comments:
Post a Comment