从JavaScript中获取成功的数据（Ajax）角度js

我正在使用角度移动Ui框架工作。我从控制器中的URL获取数据。但现在我想成功获取特定数据。我将显示我的代码片段提示。从JavaScript中获取成功的数据（Ajax）角度js

HTML：

<div class="jumbtron scrollable-content text-center bg-color"> 
    <div class="row"> 
      <div class="bgImage"> 
      </div> 
      <div class="btn-group img-responsive" ng-controller="MyControllerCity"> 
       <div ng-repeat="prdct in cityProduct"> 
        <a href="#/category-prduct" style="color:#763428; font-weight:bold;"> 
         <img src="{{prdct.categoryImage}}"> 
        </a> 
       </div> 
      </div> 

    </div> 
</div>

HTML输出

控制器：

.controller('MyControllerCity',function($scope, $http){ 
     $http({ 
       method:'get', 
       url:'http://192.168.0.3/sf/app/city-home/1', 
       headers: {'Content-Type': 'application/json'}, 
      }).success(function(data, status,headers, config) { 
       $scope.cityProduct = data; 
       console.log("aaaaaaa" + cityProduct.categoryId); 

      }).error(function(data, status, headers ,config) { 

     }) 

})

console.log("aaaaaaa" + cityProduct.categoryId);

但在控制台CATEGORYID不显示。

JSON屏幕截图：

这里是JSON响应：

[{ 
    "categoryImage": "https://www.winni.in/assets/img/app/city-home/cake.jpg", 
    "categoryName": "cakes", 
    "categoryId": 4 
}, { 
    "categoryImage": "https://www.winni.in/assets/img/app/city-home/flowers.jpg", 
    "categoryName": "flowers-and-bouquets", 
    "categoryId": 12 
}, { 
    "categoryImage": "https://www.winni.in/assets/img/app/city-home/chocolates.jpg", 
    "categoryName": "chocolates-for-all", 
    "categoryId": 63 
}, { 
    "categoryImage": "https://www.winni.in/assets/img/app/city-home/mugs.jpg", 
    "categoryName": "Mugs", 
    "categoryId": 34 
}, { 
    "categoryImage": "https://www.winni.in/assets/img/app/city-home/figurines.jpg", 
    "categoryName": "figurines", 
    "categoryId": 84 
}, { 
    "categoryImage": "https://www.winni.in/assets/img/app/city-home/giftframes.jpg", 
    "categoryName": "gift-and-photo-frames", 
    "categoryId": 106 
}, { 
    "categoryImage": "https://www.winni.in/assets/img/app/city-home/greetingcards.jpg", 
    "categoryName": "greeting-cards", 
    "categoryId": 103 
}, { 
    "categoryImage": "https://www.winni.in/assets/img/app/city-home/handicrafts.jpg", 
    "categoryName": "handicrafts", 
    "categoryId": 44 
}, { 
    "categoryImage": "https://www.winni.in/assets/img/app/city-home/penstands.jpg", 
    "categoryName": "pen-stands", 
    "categoryId": 142 
}, { 
    "categoryImage": "https://www.winni.in/assets/img/app/city-home/combos.jpg", 
    "categoryName": "gift-combos", 
    "categoryId": 99 
}, { 
    "categoryImage": "https://www.winni.in/assets/img/app/city-home/softtoys.jpg", 
    "categoryName": "soft-toys", 
    "categoryId": 104 
}, { 
    "categoryImage": "https://www.winni.in/assets/img/app/city-home/diecasttoys.jpg", 
    "categoryName": "diecast-toys", 
    "categoryId": 138 
}, { 
    "categoryImage": "https://www.winni.in/assets/img/app/city-home/jewellery.jpg", 
    "categoryName": "jewellery", 
    "categoryId": 41 
}, { 
    "categoryImage": "https://www.winni.in/assets/img/app/city-home/clocks.jpg", 
    "categoryName": "clocks", 
    "categoryId": 137 
}, { 
    "categoryImage": "https://www.winni.in/assets/img/app/city-home/crystalgifts.jpg", 
    "categoryName": "crystal gifts", 
    "categoryId": 136 
}, { 
    "categoryImage": "https://www.winni.in/assets/img/app/city-home/lamps.jpg", 
    "categoryName": "lamps", 
    "categoryId": 97 
}, { 
    "categoryImage": "https://www.winni.in/assets/img/app/city-home/slambook.jpg", 
    "categoryName": "slambook", 
    "categoryId": 139 
}]

我想在控制台得到的categoryId。

我用：

console.log("categoryId "+cityProduct[0].categoryId);

但有些错误来了，我会告诉你的屏幕控制台错误的镜头：

在此先感谢。

来源

2016-02-05 V SH

'$ scope.cityProduct = cityProduct' – dandavis

ISTR该'.success'已被弃用 – Alnitak

下面的行相混淆你：

$scope.cityProduct = data;

相继接收到的数据是对象为JSON响应的阵列。数组元素通过索引即$scope.cityProduct[0]进行访问。

console.log("aaaaaaa" + cityProduct.categoryId);

在这条线，你应该cityProduct.categoryId之前写。

这里是固定的代码：

.controller('MyControllerCity',function($scope, $http){ 
     $http({ 
       method:'get', 
       url:'http://192.168.0.3/sf/app/city-home/1', 
       headers: {'Content-Type': 'application/json'}, 
      }).success(function(data, status,headers, config) { 
       $scope.cityProduct = data; 
       // to access first element's categoryId 
       console.log("aaaaaaa" + $scope.cityProduct[0].categoryId); 
       // iterate here to access all elements' categoryId 
       $scope.cityProduct.forEach(function(product) { 
       console.log(product.categoryId); 
       }); 
      }).error(function(data, status, headers ,config) { 

     }) 

})

来源

2016-02-05 10:09:14

您的回答大致正确。但我只想要一个身份证。因为我想根据类别显示数据。就像人点击鲜花，然后只有鲜花类别显示。 –

我想把这个类别的ID附加在其他网址上。 –

只是我更新了我的问题。请检查。如果点击蛋糕类别，那么蛋糕ID会来。如果点击鲜花类别，那么鲜花ID将会出现。 –

你JSON是对象的数组，所以你需要访问它，像这样：

$scope.cityProduct[0].categoryId

或者更多的东西动态：

$scope.cityProduct.forEach(function(product) { 
    console.log(product.categoryId); 
});

另请注意，您在设置后错过了$范围cityProduct变量第一次。

来源

2016-02-05 09:49:02 millerbr

不需要'[I]'如果使用'forEach' – nada

是的，只是注意到我自己！上午很难:(固定它:) – millerbr

@millerbr。我用console.log（cityProduct [0] .categoryId）但它显示一些错误。 –

从JavaScript中获取成功的数据（Ajax）角度js

回答

相关问题