Html 如何从angularjs返回值解析Json对象，并返回另一个angularjs值？

我从$rootScope中的angularjs函数返回了Json数组。我从另一个angularjs函数获取要解析的对象的键。我不知道如何使用另一个函数返回的键从返回的json数组中解析和获取值

JS功能：

通过使用以下代码，我可以通过提供静态值来获得值

HTML代码：

我需要在html中动态解析json数组，如何实现

我需要像这样动态地获取值

<div> {$ json.test.{$ opt[0] $}.{$ opt[1] $} $} </div>

---

感谢您编辑@LiamPlease避免只使用代码的答案。相反，解释你的代码是做什么的，以及它如何/为什么可以解决这个问题。

<div> {$ json.test.analysis1.png $} </div>

<div> {$ json.test.{$ opt[0] $}.{$ opt[1] $} $} </div>

$rootScope.json = JSON.parse(JSON.stringify({"test":{"analysis1": {"png": [{"duration": "test", "transfer": "new"}], "afr": [{"duration": "test", "transfer": "new"}]}},"analysis2": {"png": [{"duration": "test", "transfer": "new"}], "afr": [{"duration": "test", "transfer": "new"}]}}));