如何在Angular中動態獲取JSON變量的值？

您好我想要做一些這樣的：如何在Angular中動態獲取JSON變量的值？

{{item.price.{{comparator}}}}

我的意思是，採取使用{{比較}}變量從類型價格值。

這是我的代碼示例（該數據爲大，我有更多類型的價格）：

var items = [ 
 
    {"name":"Item1",price:{public:10,private:15,other1:16.3,other2:17.5}}, 
 
    {"name":"Item2",price:{public:20,private:45}}, 
 
] 
 
    
 
var angularApp = angular.module('angularApp', [ 
 
    'angularAppControllers', 
 
]); 
 

 
var angularAppControllers = angular.module('angularAppControllers', []); 
 

 

 
angularAppControllers.controller('ComparationCtrl', ['$scope', 
 
    function ($scope) { 
 
     $scope.comparator = "private"; 
 
     
 
     $scope.data = items; 
 
    } 
 
]);

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> 
 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 

 
<div ng-App="angularApp"> 
 
<div ng-controller="ComparationCtrl"> 
 
    <select ng-model="comparator"> 
 
    <option value="public">Public</option> 
 
    <option value="private">Private</option> 
 
    <option value="other1">Other 1</option> 
 
    <option value="other2">Other 2</option> 
 
    <option value="othern">....</option> 
 
    </select> 
 
    {{comparator}} 
 
    <br /> 
 
    <ul> 
 
    <li ng-repeat="item in data"> 
 
     {{item.name}} - {{item.price.public}} - <strong>(item.price.{{comparator}})</strong> 
 
    </li> 
 
</ul> 
 
</div> 
 
</div>

來源

2016-08-23 Neftalí Michelet

像這樣：https://plnkr.co/edit/IrheJrHz8eOfb5LmTx7x

angular.module('app', []) 
    .config(function() { 

    }) 
    .controller('ctrl', function($scope) { 
    $scope.obj = { 
     "name": "Item1", 
     "price": { 
     "public": "10", 
     "private": "15", 
     "other1": "16.3", 
     "other2": "17.5" 
     } 
    }; 
    $scope.prop = 'public'; 
});

和HTML：

<!DOCTYPE html> 
<html ng-app="app"> 

<head> 
    <script src="https://code.angularjs.org/1.5.8/angular.js"></script> 
    <link rel="stylesheet" href="style.css"> 
</head> 

<body ng-controller="ctrl"> 
    <pre>{{obj.price[prop]|json}}</pre> 
    <script src="script.js"></script> 
</body> 

</html>

基本上，{{OBJ [aPropertyDefinedInScope]}}

來源

2016-08-23 23:27:28 Skaparate

嗚嗚，假設item.price和comparator在你的$範圍定義嘗試：

{{ item.price[comparator] }}

來源

2016-08-23 23:20:27 ulybu

如何在Angular中動態獲取JSON變量的值？

回答

相關問題