angular 服务未按预期操作值

Question

我有一个 angular 服务来处理我的承诺，但我不确定如何从该服务中操作 $scope 上的值。我知道我做的是错的，但不明白我需要做什么才能正确。

为我服务：

.service('resolvePromiseService', function(){
    var publicInterface = {
        resolvePromise: resolvePromise
    }

function resolvePromise(promise, resultObject, callBackFunction, spinner){
    spinner ++;
    promise.then(function(result){
        resultObject = result;
        if(callBackFunction){
            callBackFunction();
        }
    });
    promise['catch'(function(error){
        //generic error handling
    });
    promise['finally'(function(){
        spinner--;
    });
}

在调用服务的控制器中

var getInfoPromise = dataAccessService.getInfoByLocationId(locationId).$promise;
resolvePromiseService.resolvePromise(getInfoPromise, $scope.locationInfo, $scope.setUpLocation, $scope.loadingSpinner);

在 resolvePromise 函数中，我看到值按预期进入并按预期更新，但我认为我误解了 $scope 的传递方式。我相信我正在用香草 javascript 对象替换 angular 对象。

Answer 1

最好的选择是您传入范围对象或重新考虑您处理承诺的方式。

发生这种情况的原因与修改引用有关。

在你的例子中

$scope.loadingSpinner = 5; // ref1 - val 5
function resolvePromise(promise, resultObject, callBackFunction, spinner){
  // when we enter the function both $scope.loadingSpinner and spinner are both 
  // referencing the same variable
  spinner; // ref1 - val5
  // after we increment spinner the local reference is no longer pointing 
  // at the reference
  spinner; // ref2 - val6
  // therefore we are not actually updating the $scope.loadingSpinner 
  //reference just the local spinner one
}

我包含了一个片段来证明这一点 - 您需要记住，您正在重新分配引用，这不是您在这种情况下打算做的事情。

angular
  .module('Test',[])
  .service('IncrementService', incrementService)
  .controller('MyController', myController)

function incrementService() {
  this.increment = function(valToInc) {
    valToInc++;
    console.log(valToInc);
  }
  
  this.incrementScopeField = function($scope, field) {
    $scope[field]++;
    console.log($scope[field]);
  }
}

myController.$inject = ['$scope', 'IncrementService'];

function myController($scope, IncrementService) {
  $scope.number = 5;
  $scope.inc = function() {
    IncrementService.increment($scope.number);
  }
  $scope.inc2 = function() {
    IncrementService.incrementScopeField($scope, 'number');
  }
}

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>

<div ng-app='Test' ng-controller='MyController'>
  <button ng-click='inc()'>increment value</button><button ng-click='inc2()'>increment scope</button>
  <br/>{{ number }}
</div>

angular 服务未按预期操作值

angular service not manipulating values as expected

angularjs

angular-services