Warning: file_get_contents(/data/phpspider/zhask/data//catemap/9/javascript/376.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Javascript 如何将函数从工厂传递到控制器angularJS_Javascript_Angularjs - Fatal编程技术网

Javascript 如何将函数从工厂传递到控制器angularJS

Javascript 如何将函数从工厂传递到控制器angularJS,javascript,angularjs,Javascript,Angularjs,现在我有一个JS文件箱:你可以在里面看到更多图片的infite滚动加载。当javascript第13行的滚动条到达页面底部时,会添加这些图像: angular.module('infinitescroll', []).directive('onScrolled', function () { return function (scope, elm, attr) { var el = elm[0]; elm.bind('scroll', function

现在我有一个JS文件箱:你可以在里面看到更多图片的infite滚动加载。当javascript第13行的滚动条到达页面底部时,会添加这些图像:

angular.module('infinitescroll', []).directive('onScrolled', function () {
    return function (scope, elm, attr) {
        var el = elm[0];

        elm.bind('scroll', function () {
            if (el.scrollTop + el.offsetHeight >= el.scrollHeight) {
                scope.$apply(attr.onScrolled);
            }
        });
    };
}).controller("scrollCtrl", function($scope, getStuff){
  $scope.data = getStuff;
  $scope.loaddata = function(){
    var length = $scope.data.length;
    for(var i = length; i < length + 10; i ++){
      $scope.data.push(i);
    }
  };
  $scope.loaddata();
}).factory('getStuff',function($http) {
   var images_list = ["www.google.com","www.facebook.com","www.supercuber.com","www.snappiesticker.com"];     
   images_list.addStuff = function(){  $http.get("http://jsbin.com/yehag/2").success(function(data){
    var returned_list = JSON.parse(data.javascript);
    console.log(returned_list);
    for (var i=0;i<8;i++){
      images_list.push(returned_list[i].name);

    }
  });
  };
  console.log(images_list);
  return images_list;
});
angular.module('infinitescroll',[])指令('onScroll',函数(){
返回函数(范围、elm、属性){
var el=elm[0];
elm.bind('scroll',函数(){
如果(el.scrollTop+el.offsetHeight>=el.scrollHeight){
范围:$apply(attr.onScrolled);
}
});
};
}).controller(“scrollCtrl”,函数($scope,getStuff){
$scope.data=getStuff;
$scope.loaddata=函数(){
变量长度=$scope.data.length;
对于(变量i=长度;i<长度+10;i++){
$scope.data.push(i);
}
};
$scope.loaddata();
}).factory('getStuff',函数($http){
var images_list=[“www.google.com”、“www.facebook.com”、“www.supercuber.com”、“www.snapiesticker.com”];
images_list.addStuff=function(){$http.get(“http://jsbin.com/yehag/2)。成功(功能(数据){
返回的var_list=JSON.parse(data.javascript);
console.log(返回的\u列表);

for(var i=0;i
images\u list
是一个数组。您不能像
images\u list.addStuff

创建一个对象并从工厂返回该对象

factory('getStuff',function($http) {
    var images_list = ["www.google.com","www.facebook.com","www.supercuber.com","www.snappiesticker.com"]; 

    var addStuff = function(){....};    

     return{
          images_list: images_list,
          addStuff: addStuff
     }
});
然后在控制器中:

$scope.data = getStuff.images_list;

$scope.loaddata = getStuff.addStuff

这并不是一种干净的方法来创建一个具有附加属性的类似数组的对象,但是上面关于“不能将函数添加到数组”的回答是不正确的。虽然创建类似数组的对象有点混乱,应该尽可能避免。如果您觉得这是绝对必要的,我会这样处理(这与jQuery的工作方式类似

function ImagesList($http) {
  this.push.apply(this, [
    "www.google.com",
    "www.facebook.com",
    "www.supercuber.com",
    "www.snappiesticker.com"
  ]);
  this._$http = $http;
}
ImagesList.prototype = {
  push: [].push,
  splice: [].splice,
  pop: [].pop,
  indexOf: [].indexOf,
  addStuff: function () {
    this._$http.get("http://jsbin.com/yehag/2").then(function(data){
      var returnedList = angular.toJson(data.javascript);
      for (var i=0; i<8; i++) {
        this.push(returnedList[i].name);
      }
    }.bind(this));
  }
};
angular
.module('infinitescroll', [])
.service('imageList', ImagesList);
.directive('onScrolled', function () {
  return {
    scope: {
      onScrolled: '&'
    },
    link: function (scope, elm, attr) {
      var el = elm[0];

      // Original implementation will end up causing memory leak because
      // the handler is never destroyed.  Use as follows
      elm.on('scroll.iScroll', function () {
        if (el.scrollTop + el.offsetHeight >= el.scrollHeight) {
          scope.$apply(attr.onScrolled);
        }
      }).on('$destroy', function () {
        elm.off('.iScroll');
      });
    }
  };
}).controller("scrollCtrl", function($scope, imageList){
  $scope.data = imageList;
  $scope.loaddata = function(){
    var length = $scope.data.length;
    for(var i = length; i < length + 10; i++){
      $scope.data.push(i);
    }
  };
  $scope.loaddata();
})
函数图像列表($http){
这个,推,应用(这个[
“www.google.com”,
“www.facebook.com”,
“www.supercuber.com”,
“www.snapiesticker.com”
]);
这是。$http=$http;
}
ImagesList.prototype={
推送:[]推送,
拼接:【】。拼接,
流行音乐:[]流行音乐,
indexOf:[]indexOf,
addStuff:function(){
这是。$http.get(“http://jsbin.com/yehag/2)然后(函数(数据){
var returnedList=angular.toJson(data.javascript);
对于(变量i=0;i=el.scrollHeight){
范围:$apply(attr.onScrolled);
}
}).on(“$destroy”,函数(){
elm.off(“.iScroll”);
});
}
};
}).controller(“scrollCtrl”,函数($scope,imageList){
$scope.data=图像列表;
$scope.loaddata=函数(){
变量长度=$scope.data.length;
对于(变量i=长度;i<长度+10;i++){
$scope.data.push(i);
}
};
$scope.loaddata();
})