Question

我有一个用json填充的选择框。这是json ......

{
"Connectivity": [

    {
        "product_id": 1,
        "product_name": "SmartLink",
        "product_price_attributes": [
            {
                "key": "postcodeA",
                "type": "text"
            },
            {
                "key": "BearerBW",
                "type": "text"

            },
            {
                "key": "Total bandwidth",
                "type": "text"
            }
        ]
    },
    {
        "product_id": 2,
        "product_name": "SmartNet",
        "product_price_attributes": [
            {
                "key": "postcodeA",
                "type": "text"
            },
            {
                "key": "BearerBW",
                "type": "text"
            }
        ]
    },
    {
        "product_id": 3,
        "product_name": "Centralised Internet",
        "product_price_attributes": [
            {
                "key": "BearerBW",
                "type": "text"
            }
        ]
    }

],
"Cloud Services": [
    {
        ...
    }
]
}

我在控制器中使用此代码来填充下拉列表

 $http.get('scripts/json/sample-products.json')
        .then(function(res){
            $scope.portfolio1 = res.data.Connectivity;
        });

这会创建像这样的选择框

<select ng-model="selectedProduct" ng-options="opt as opt.product_name for opt in portfolio1" 
ng-change="getPriceAttributes()">
<option value="0" selected="selected" label="SmartLink">SmartLink</option>
<option value="1" label="SmartNet">SmartNet</option>
<option value="2" label="Centralised Internet">Centralised Internet</option>

当我从我的选择框中选择一个选项时，会触发getPriceAttributes（）。它看起来像这样......

 $scope.getPriceAttributes = function() {
        $http.get('scripts/json/sample-products.json')
            .then(function(res){
                $scope.formFields = res.data;
            });
    };

所以我的问题是我不知道如何深入到达所选产品的嵌套对象'product_price_attributes'。我不确定我需要传递给getPriceAttributes或我需要更改为函数以使其工作。

有什么想法吗？

非常感谢

Answer 1

selectedProduct设置为opt - 这是Connectivity数组中的每个项目，因此只需：

console.log($scope.selectedProduct.product_price_attributes)

您还可以将模型作为参数传递给change函数：

$scope.getPriceAttributes = function(item) {
    console.log(item.product_price_attributes)
    ...
}

<select ng-model="selectedProduct" ng-options="opt as opt.product_name for opt in portfolio1" ng-change="getPriceAttributes(selectedProduct)">

用角度选择嵌套的json

1 个答案: