将$ scope值从控制器传递给服务函数

时间:2016-07-21 09:09:18

标签: javascript angularjs

我需要将范围值传递给服务,我现在正在做的是取消控制器中服务的功能,并将范围值作为参数传递给该函数。这是代码

HTML代码

<md-datepicker ng-model="dateDebut"   md-placeholder="Enter date"> </md-datepicker>
<md-datepicker ng-model="dateFin"  md-placeholder="Enter date" ></md-datepicker>

控制器代码

app.controller('graphCtrl', function($scope, $stateParams, graphDetails, $filter,$http) { 

  var self = this;

  self.dateDebut = $scope.dateDebut;
  self.dateFin = $scope.dateFin;

  var mettreAJour = graphDetails.mettreAJour(self.dateDebut, self.dateFin);

  $scope.labels = mettreAJour.labels;
  $scope.data = mettreAJour.data;
});

服务代码

app.factory('graphDetails', function($filter, $http) {
  var labels = [];
  var data = [
    []
  ];

  return {
    mettreAJour: function(dateDebut, dateFin) {
      if (dateDebut && dateFin) {
        var dd = $filter('date')(dateDebut, 'yyyy-MM-dd;HH:mm:ss');
        var df = $filter('date')(dateFin, 'yyyy-MM-dd;HH:mm:ss');
        var dif = dateFin.getDate() - dateDebut.getDate();

        //do somthing with labels and data
        return {
          labels : labels,
          data : data
        };

      }
    }
  };
});

所以我得到的错误标签没有定义,如果我发表评论我得到这个错误:

Cannot read property 'getDate' of undefined

表示代码无法识别dateFindateDebut

是否有另一种方法将范围传递给服务,或者我在当前代码中遗漏了什么?

2 个答案:

答案 0 :(得分:0)

这很可能是因为您试图从labels返回mettreAJour,但它不知道labels&amp; data

希望下面的代码段有用。

app.factory('graphDetails', function($filter, $http) {
  var _graphDeatilsObject = {};
  _graphDeatilsObject.labels = [];
  _graphDeatilsObject.data = [
    []
  ];

  _graphDeatilsObject.mettreAJour = function(dateDebut, dateFin) {
    // Rest of the code
  }
  return _graphDeatilsObject;
});

如果您要缩小代码

,请查看inline array annotation

答案 1 :(得分:0)

如果我正确理解了这个问题,那么当范围的dateDebutdateFin属性发生变化时,您需要以某种方式重新评估值。

要实现此目的,您可以使用范围的$watch$watchGroup方法。 Simplified Demo

例如

app.controller('graphCtrl', function($scope, graphDetails) {

  // start watcher
  $scope.$watchGroup(['dateDebut', 'dateFin'], function(args) {
    var debut = args[0], fin = args[1];
    angular.extend($scope, graphDetails.mettreAJour(debut, fin))
  })
})
相关问题