Implementing the Page AngularJS Controller

Next, you need to implement a controller to support the webpage comments. Listing 27.17 shows the pageController code. Notice that commentSrv is also injected into this controller, along with the $http service.

The controller initializes $scope.page, makes an $http GET request to /pages, and passes the hard-coded "Photos Page" name as a parameter. The $scope.loadComments() function calls the commentSrv.getComment() function to retrieve the comments for the page by $scope.page.commentId. The callback function simply sets the $commentThread value that is used in the view.

The $scope.addReply() method is called when the user clicks Send in the page comments template. Notice that it first generates a newComment object with the subject and body passed in from the view and then uses commentSrv.addComment() to send the update to the server.

Listing 27.17 comment_app.js-pageController: Implementing an AngularJS controller that supports the page comments portion of the view

Click here to view code image

65 app.controller('pageController', ['$scope', '$http','commentSrv',
66                             function($scope, $http, commentSrv) {
67      $http.get('/page', {params:{pageName:"Photos Page"}})
68        .success(function(data, status, headers, config) {
69           $scope.page = data;
70           $scope.loadComments();
71         })
72         .error(function(data, status, headers, config) {
73           $scope.Page = {};
74         });
75      $scope.addReply = function(parentCommentId, subject, body){
76        var newComment = {subject:subject, body:body};
77        commentSrv.addComment($scope.commentThread._id,
78                              parentCommentId,
79                              newComment, function(err, comment){
80          $scope.loadComments();
81        });
82      };
83      $scope.loadComments = function(){
84        commentSrv.getComment($scope.page.commentId,
85                              function(err, comment){
86          if(err){
87            $srope.commentThread = {};
88          } else {
89            $scope.commentThread = comment;
90          }
91        });
92      };
93    }]);