The canonical approach would be to inject $scope into your controller, and in the success (I prefer .then personally, as that's the promise standard, but they're equivalent) route, do something like $scope.dataList = data, or whatever part of the response data you want to use.
Alternatively, you could fiddle with ng-resource, which IIRC returns a reference that will magically fill with data when the promise resolves. I think restangular might do that too, but I don't use restangular. I just go with the promise.then strategy in the controller for the most part. e On Mon, Aug 18, 2014 at 9:00 AM, Bruno Finger <[email protected]> wrote: > Hello, > > I am learning AngularJS and I have encountered an issue I can't pass by. > > I am writing a small test page that retrieves some data from a RESTful API > I have previously written. > > I can successfully retrieve this data from Angular, but I can't seem to > find a way to display this data on the page. I am trying to loop over the > list of results and print it in a table. > > This is my index.html: > > <!DOCTYPE html><html> > <head> > <title>AngularJS</title> > > <meta http-equiv="Content-Type" content="text/html;charset=utf8" > > > <link rel="stylesheet" type="text/css" href="./css/bootstrap.css"> > > <script type="application/javascript" > src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.0-beta.18/angular.js";></script> > > <script type="application/javascript" src="./js/URLSet.js"></script> > <script type="application/javascript" src="./js/app.js"></script> > </head> > <body ng-app="MyApp"> > <div ng-controller="URLSetDAO as dao"> > <button class="btn" ng-click="dao.list()">List</button> > <table class="table" ng-init="urlsets = dao.list()"> > <td ng-repeat="urlset in urlsets"> > <tr> > {{ urlset.pk }} > </tr> > <tr> > {{ urlset.user }} > </tr> > <tr> > {{ urlset.title }} > </tr> > <tr> > {{ urlset.views}} > </tr> > <tr> > {{ urlset.type }} > </tr> > </td> > </table> > </div> > </body></html> > > This is the app.js: > > (function() { > var app = angular.module('MyApp', ['URLSet']);})(); > > And this is the URLSet.js: > > (function() { > var app = angular.module('URLSet', []); > > app.controller('URLSetDAO', ['$http', function($http){ > var ip = "http://localhost:8000";; > var store = this; > > this.list = function() { > return $http({method: 'GET', url: ip + '/urlsets/'}) > .success(function(data, status, headers, config) { > console.log(data); > }) > .error(function(data, status, headers, config) { > > }); > }; > > this.read = function(id) { > $http({method: 'GET', url: ip + '/urlsets/' + id}) > ... > }; > > this.create = function(obj) { > $http({method: 'POST', url: ip + '/urlsets/'}) > ... > }; > > this.update = function(id, obj) { > $http({method: 'PUT', url: ip + '/urlsets/' + id}) > ... > }; > > this.remove = function(id) { > $http({method: 'DELETE', url: ip + '/urlsets/' + id}) > ... > }; > }]);})(); > > I understand that Promises work similarly to callbacks, so it's > asynchronous. So how am I able to display this data, if ng-init will not > wait for the function to finish? > > -- > You received this message because you are subscribed to the Google Groups > "AngularJS" group. > To unsubscribe from this group and stop receiving emails from it, send an > email to [email protected]. > To post to this group, send email to [email protected]. > Visit this group at http://groups.google.com/group/angular. > For more options, visit https://groups.google.com/d/optout. > -- You received this message because you are subscribed to the Google Groups "AngularJS" group. To unsubscribe from this group and stop receiving emails from it, send an email to [email protected]. To post to this group, send email to [email protected]. Visit this group at http://groups.google.com/group/angular. For more options, visit https://groups.google.com/d/optout.
