javascript 如何将数组从服务函数传递到控制器(AngularJs)中的作用域?

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/29763696/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-10-28 11:01:58  来源:igfitidea点击:

How to pass array from service function to scope in controller (AngularJs)?

javascriptangularjs

提问by nmfzone

I have an angular service shown below :

我有如下所示的角度服务:

    .service('shareDataService', function() {
            var myXi = [];
            var myYi = [];

            var addXi = function(newObj) {
                myXi = newObj;
            }

            var addYi = function(newObj) {
                myYi = newObj;
            }

            var getPlot = function() {
                var a = [];

                for (var i = 0; i < myXi.length; i++) {
                    a.push([myXi[i], myYi[i]]);
                }

                return a;
            }

            return {
                addXi: addXi,
                addYi: addYi,
                getPlot: getPlot
            };
    });

And i have angular controller :

我有角度控制器:

    .controller('plotController', function($scope, shareDataService) {
            $scope.getYo = function() {
                    return shareDataService.getPlot();
            };
            $scope.lineChartData = [
                    $scope.getYo()
            ];
    });

I need to send a value from $scope.getYo to $scope.lineChartData (it will be and array). How can I do that? I've tried like that, but if I call $scope.lineChartData in HTML, I get nothing. The data that I need is

我需要从 $scope.getYo 发送一个值到 $scope.lineChartData (它将是和数组)。我怎样才能做到这一点?我试过这样,但如果我在 HTML 中调用 $scope.lineChartData,我什么也得不到。我需要的数据是

    [
            [
                    [2,0],
                    [3,1],
                    [5,4]
            ]
    ];

UPDATE :

更新 :

See my complete explanation in http://laravel.io/bin/6LVej. Thanks

http://laravel.io/bin/6LVej 中查看我的完整解释。谢谢

回答by Bharat Bhushan

As we know factory and services are basically used for sharing the data. But both have different use and meaning. The basic difference is Factory should always return Object and Service should return Function(constructor function in JS). Here is code snippet that may be helpful in your case.

众所周知,工厂和服务基本上用于共享数据。但两者都有不同的用途和意义。基本的区别是工厂应该总是返回对象,服务应该返回函数(JS 中的构造函数)。这是可能对您的情况有所帮助的代码片段。

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

app.service('arrayService', function() {
  return function() {
    this.getArray = function() {
      return [1, 2, 3, 4, 5];
    }
  }
})
app.factory('arrayFactory', function() {
  return {
    getArray : function() {
      return [9,8,7,6,5];
    }
  }
})
app.controller('MainCtrl', ['$scope','arrayService','arrayFactory',
  function($scope, arrayService,arrayFactory) {
    var ary = new arrayService();
    $scope.serviceArrayObject = ary.getArray();
     $scope.factoryArrayObject = arrayFactory.getArray()

  }
]);

Here is the plunker for basic difference How we use service and factory

这是基本差异的plunker我们如何使用服务和工厂

回答by samyak bhalerao

Try following code

试试下面的代码

.controller('plotController', function($scope, shareDataService) {

        $scope.lineChartData =shareDataService.getPlot();
});

回答by dfsq

Since getYoreturns an array, you can simply assign its return value to lineChartDatadirectly:

由于getYo返回一个数组,您可以简单地将其返回值lineChartData直接分配给:

$scope.lineChartData = $scope.getYo();

回答by Ramesh Rajendran

this shareDataService.getPlot();is return the array object, So you can directly call this to $scope.lineChartData. try this

shareDataService.getPlot();是返回数组对象,因此您可以直接将其调用到$scope.lineChartData. 试试这个

 .controller('plotController', function($scope, shareDataService) {             
            $scope.lineChartData = shareDataService.getPlot();
    });

You don't need write this code

您不需要编写此代码

        $scope.getYo = function() {
                return shareDataService.getPlot();
        };