Question

我试图在模板中显示来自len请求的数据，该模板显示在$http内。

我做了一些测试，当数据不是来自解析（ngRoute）时，ngRepeat工作正常（例如，如果我在ng-view中硬编码对象数组）。我搜索了很多，发现了很多例子，但没有这个具体问题。

这里是代码：

app.js

$scope.products

产品controller.js



"use strict";
angular.module('himerosApp',[])
.config(['$routeProvider',function($routeProvider){
    $routeProvider
    .when('/index', {
        templateUrl: 'templates/welcome.html'
    })
    .when('/products/aerosois', {
        templateUrl: 'templates/products.html',
        controller: 'ProductController',
        resolve: {
            messages: function (productService) {
                return productService.getProducts();
            }
        }
    })
    .when('/social', {
        templateUrl: 'templates/social.html'
    })
    .otherwise({
        redirectTo: '/index'
    });

}]);

产品service.js

"use strict";
angular.module('himerosApp',[])
.config(['$routeProvider',function($routeProvider){
    $routeProvider
    .when('/index', {
        templateUrl: 'templates/welcome.html'
    })
    .when('/products/aerosois', {
        templateUrl: 'templates/products.html',
        controller: 'ProductController',
        resolve: {
            messages: function (productService) {
                return productService.getProducts();
            }
        }
    })
    .when('/social', {
        templateUrl: 'templates/social.html'
    })
    .otherwise({
        redirectTo: '/index'
    });

}]);

提前致谢！

Answer 1

解析将数据作为字符串注入控制器。 JSON.parse（messages）解决了这个问题。

Answer 2

建议在服务方法（getProducts()）内进行解包。

提供给$ http的第二个函数已经返回一个被拒绝的promise，所以我建议只返回数据。如果您需要按照建议的方式解压缩，请return response.data.message;或更确切地说return JSON.parse(response.data.message);。

如果您控制了使用标题Content-Type: application/json返回的后端服务，也会建议您更准确地描述有效负载并避免在前端出现此问题。

Answer 3

看起来你忘记了getProducts函数的$ q对象的解析。

您可以尝试按return response.data;

替换$q.resolve(response.data);

this.getProducts = function() {

    return $http.get("/products").then(
        function( response ) {
            $q.resolve(response.data);
        },
        function( response ) {

            if(!angular.isObject( response.data ) ) {
                console.log('unknown error');
                return ( $q.reject( "An unknown error ocurred." ) );
            }       

            console.log(response.data.message);
            return ( $q.reject( response.data.message ) );
        }
    );
};

如果数据来自$ http请求，ng-repeat在ng-view内部不起作用

3 个答案: