在Angular服务中使用$ http作为json数据

I'm having a issue with angular services. The code included are 2 factory services. The values in the services are used to populate a slider in view.

我有角度服务的问题。包含的代码是2个工厂服务。服务中的值用于填充视图中的滑块。

I've tried for a day before asking. I've reviewed a couple posts here stackoverflow post and the post linked.

在问之前我已经尝试了一天。我在这里回顾了几个帖子stackoverflow帖子和帖子链接。

The first function references a $http GET to a json file. The second function are the values hard coded.

第一个函数将$ http GET引用到json文件。第二个函数是硬编码的值。

The slider program is able to display the required fields from gloveSize() with no issue.

滑块程序能够显示glovesSize（）中的必填字段，没有任何问题。

But putting the exact same info in a json file the slider issues undefined.

但是将完全相同的信息放在json文件中滑块发出未定义的问题。

function glvType($http) {
        function getGloves() {
            return $http.get('./assets/test.json').success(function (data) {
                return data;
            })
        }

        return { getGloves:getGloves }
    }

    function gloveSize() {
        function getGloveSize() {
            return [{ value: '10.50', legend: 'Youth Baseball' },
                    { value: '11.00', legend: '2B/SS', id: 'bfbee3fb9893fc6d8555bbfa06176619' },
                    { value: '11.25' },
                    { value: '11.50', legend: 'Pitcher' },
                    { value: '11.75', legend: '3B/Pitcher' },
                    { value: '12.00' },
                    { value: '12.25', legend: 'Softball Inf' },
                    { value: '12.50', legend: 'Outfield' },
                    { value: '12.75', legend: 'OF/1st Base' },
                    { value: '13.00' }];
        }
        return { getGloveSize:getGloveSize }
    }

In the glvType function console.log of the data is there. In the controller,following answer from other posts, understanding the concept of promise functionality.

在glvType函数中，数据的console.log就在那里。在控制器中，按照其他帖子的回答，理解承诺功能的概念。

Array [ Object, Object, Object, Object, Object, Object, Object, Object, Object, Object, 3 more… ]

数组[对象，对象，对象，对象，对象，对象，对象，对象，对象，对象，还有3个......]

$scope.product = gloveSize.getGloveSize();
$scope.glvSpec = glvType.getGloves().then(function (data) {

            $scope.gloveSpec = data;
            for (var i; i < $scope.gloveSpec; i++) {
                console.log($scope.gloveSpec[i].value);
            }

        });

From here, I tell the slider directive to pull array data from $scope.glvSpec, however the results contiue are undefined.

从这里开始，我告诉slider指令从$ scope.glvSpec中提取数组数据，但结果是未定义的。

A console.log in the then(function) shows that the info is there.

then（函数）中的console.log显示信息存在。

Object { data: Array[13], status: 200, headers: fd/<(), config: Object, statusText: "OK" }

Object {data：Array [13]，status：200，headers：fd / <（），config：Object，statusText：“OK”}

Lastly, the scope.product variable you see in code is how I pull the static function array into the controller. Adding this to the directive options, displays the values as designed.

最后，您在代码中看到的scope.product变量是我如何将静态函数数组拉入控制器。将其添加到指令选项，将按设计显示值。

Thanks for any guidance.

感谢您的指导。

2 个解决方案

#1

Change your getGloves() to return the $http call itself instead of using the success method to return data - then data will be available in your .then params:

更改你的getGloves（）以返回$ http调用本身，而不是使用success方法返回数据 - 然后数据将在你的.then参数中可用：

function getGloves() {
    return $http.get('./assets/test.json');
}

2 个解决方案

#1

更多相关文章

随机推荐