Question

我有以下控制器和视图，并希望在视图中显示productCategory对象的属性。即使控制器中存在productCategory，它也不会显示在视图中。

控制器：

angular.module('jordans')
    .controller('productCategoryCtrl', function ($scope, $rootScope, dataService) {
        $scope.productCategories = [];
        $scope.currentData = {};
        $scope.productCategory = [];

        $scope.getCategories = function () {
            dataService.getProductCategories().then(function (data) {
                $scope.productCategories = data;
//                    console.log('productCategories = ' + JSON.stringify($scope.productCategories));
            })
        }

        $scope.getCategory = function () {
            $scope.productCategory = dataService.getProductCategory($scope.currentData);
            console.log('productCategory = ' + JSON.stringify($scope.productCategory));
        }

        $rootScope.$on('setcategory', function (e, args) {
            console.log('******** ' + new Date());

            $scope.currentData.category = args.category;
            $scope.currentData.type = args.type;
            console.log('*******productcategory.currentdata = ' + JSON.stringify($scope.currentData))
            $scope.getCategory($scope.currentData);
        });

        var init = function () {
            $scope.getCategories();
        };

        init();

    })

查看：

<div ng-controller='productCategoryCtrl' ng-hide="data.error">
<div class="col-sm-10">
    <img src="..\assets\images\{{productCategory.image[0].name}}">
    <p class="categoryheading">{{productCategory.image[0].label}}</p>
    <div ng-repeat="productImage in productCategory.image">
        <div ng-if="$index > 0">
            <div class="col-sm-4 typemargin">
                <div class="card">
                    <div class="card-block">
                        <img src="..\assets\images\{{productCategory.image[i].name}}">
                    </div>
                    <div class="card-text">
                        <p><b>{{productCategory.image[$index].label}}</b></p>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>

Answer 1

我认为你的问题是productCategory是数组而你正在对productCategory.image [0]进行ng-repeat而你无法访问它，你可以访问productCategory [0] .image [ 0]。

您应该遍历所有productCategory数组，然后放入您的代码。所以只需对整个块执行ng-repeat，如：

<div class="col-sm-10" ng-repeat="prodCat in productCategory">

...然后在div块中使用prodCat而不是productCategory。

同样只是提示，与您的问题无关，当您使用console.log时，不要使用串联+只使用逗号，即

console.log('productCategory', $scope.productCategory);

这样你就不会需要jsonstringify，你可以获得可以在控制台中与之交互的好对象。

另外另一个原因是你只需要productCategory [0] .image，我真的不知道你的测试对象，所以它只是猜测。

AngularJs：即使数据存在于控制器中，View也不显示数据

1 个答案: