Angularjs scope variable after $http call isn't updated in the view

Question

I have this in the service:

UpdateQuestionsSmsStatus: function (smsProfileId, active) {
    //TODO: ajax get data
    var promise = this.UpdateQuestionsSmsStatusInternal(smsProfileId, active).then(function (response) {
        // The return value gets picked up by the then in the controller.
        return response;
    });
    // Return the promise to the controller
    return promise;
},

UpdateQuestionsSmsStatusInternal: function (smsProfileId, active) {

    return $http({ method: 'GET',
        url: '../QuestionManagement/UpdateQuestionsSmsStatus?smsProfileId=' + smsProfileId + '&active=' + active
    }).
      success(function (data, status, headers, config) {
          // this callback will be called asynchronously
          // when the response is available
          response = data;
      }).
      error(function (data, status, headers, config) {
          // called asynchronously if an error occurs
          // or server returns response with an error status.
          if (window.console && console.log) {
              console.log("Could not obtain questions received. Error:" + data + "Status:" + status + "Headers:" + headers + "Config:" + config);
          }
      });
},

This in my controller:

$scope.updateQuestionsSmsStatus = function () {
    questionSelectionService.UpdateQuestionsSmsStatus($scope.smsProfile.Id, !$scope.smsProfile.Active).then(function (output) {
        $scope.smsProfile.Active = (output.data.result == "success") ? output.data.active : !output.data.active;
    });

};

Which is called onclick from the view. And this in the view:

{{smsProfile.Active}}

The value in the view is never updated. Debugger doesn't show anything wrong, no errors appear.

Does anyone have any ideas? Thank you.

Does the debugger see the data coming all the way back to the controller? eg, is output.data populated in your last promise? — Roy Truelove
– Roy Truelove, Commented Mar 3, 2013 at 18:14
is it using onclick or ng-click? If it's the former then you should wrap the onclick callback in a $scope.$apply. If it's the latter then something else is up, since ng-click wraps it in an $apply for you. — Roy Truelove
– Roy Truelove, Commented Mar 3, 2013 at 18:39

Stewie · Accepted Answer · 2013-03-03 22:41:47Z

1

Your success callback in UpdateQuestionsSmsStatusInternalfunction needs to return a value:

return $http({ method: 'GET',
        url: '../QuestionManagement/UpdateQuestionsSmsStatus?smsProfileId=' + smsProfileId + '&active=' + active
    }).
      success(function (data, status, headers, config) {
          return data;
      })
      ...

and, to accommodate that, your controller's updateQuestionsSmsStatus function should adjust the callback:

$scope.updateQuestionsSmsStatus = function () {
  questionSelectionService.UpdateQuestionsSmsStatus($scope.smsProfile.Id, !$scope.smsProfile.Active).then(function (data) {
      $scope.smsProfile.Active = (data.result == "success") ? data.active : !data.active;
    }
   );
 };

answered Mar 3, 2013 at 22:41

Stewie

60.4k20 gold badges148 silver badges113 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

Angularjs scope variable after $http call isn't updated in the view

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related