7

考虑一下这个 Plunkr

在我的手表监听器中,我想更新一个已解决的承诺的属性。

  • 修改属性值是否正确$$v
  • 如果没有,那我该怎么办?

这是HTML:

<!DOCTYPE html>
<html id="ng-app" ng-app="myAngularApp">

  <head>
    <script data-require="angular.js@*" data-semver="1.2.0-rc2" src="http://code.angularjs.org/1.2.0-rc.2/angular.js"></script>
    <script src="script.js"></script>
  </head>

  <body ng-controller="MyController">
    <input ng-model="myDto.Weight" />{{myDto.Status}}
  </body>

</html>

这是JavaScript:

var myDto = {Weight: 200, Status: 'Acceptable'};

var myAngularApp = angular.module('myAngularApp', []);

myAngularApp.factory('myService', function($q){
  return {
    getMyDto: function(){
      var deferred = $q.defer();
      deferred.resolve(myDto);
      return deferred.promise;
    }
  };
});

myAngularApp.controller('MyController', function MyController($scope, myService){
  $scope.myDto = myService.getMyDto();
  $scope.$watch('myDto.Weight', function(newVal, oldVal){
    if (newVal < 150) {
      $scope.myDto.$$v.Status = 'Too Light!'; // Is this the recommended way of doing it?
    }
    else if (500 < newVal) {
      $scope.myDto.$$v.Status = 'Too Heavy!';
    }
    else if (Number(newVal)) {
      $scope.myDto.$$v.Status = 'Acceptable';
    }
    else {
      $scope.myDto.$$v.Status = 'Not a number!';
    }
  });
});
4

2 回答 2

8

我不会$$v直接修改,这是一个实现细节。相反,使用then来获得承诺的结果,然后随心所欲地使用它。这需要对您的代码进行最少的更改。

演示链接

myAngularApp.controller('MyController', function MyController($scope, myService){
  ($scope.myDto = myService.getMyDto()).then(function(myDto) {
    $scope.$watch('myDto.Weight', function(newVal, oldVal){
      if (newVal < 150) {
        myDto.Status = 'Too Light!'; // Is this the recommended way of doing it?
      }
      else if (500 < newVal) {
        myDto.Status = 'Too Heavy!';
      }
      else if (Number(newVal)) {
        myDto.Status = 'Acceptable';
      }
      else {
        myDto.Status = 'Not a number!';
      }
    });
  });
});
于 2013-09-08T03:13:58.557 回答
3

修改 Promise 有点奇怪,因为 Promise 代表异步执行的操作的结果。它是独立的。

我认为最好添加另一个服务功能来更新数据状态。尝试这个

myAngularApp.factory('myService', function ($q) {
    var deferred = $q.defer();
    return {
        getMyDto: function () {
            deferred.resolve(myDto);
            return deferred.promise;
        },
        updateStatus: function (status) {
            myDto.Status = status;
            deferred.resolve(myDto);
            return deferred.promise;
        }
    };
});

myAngularApp.controller('MyController', function MyController($scope, myService) {
    $scope.myDto = myService.getMyDto();
    $scope.$watch('myDto.Weight', function (newVal, oldVal) {
        if (newVal < 150) {
            myService.updateStatus('Too Light!');
        } else if (500 < newVal) {
            myService.updateStatus('Too Heavy!');
        } else if (Number(newVal)) {
            myService.updateStatus('Acceptable');
        } else {
            myService.updateStatus('Not a number!');
        }
    });
});

Updated Plunker

于 2013-09-08T03:02:13.413 回答