引用 angular {{ }} html 标记中对象的值

Question

我在 AngularJS 1，我想通过引用一个对象的值来显示我正在显示的元素的值，该对象的键值为元素的值。

目前我的实现效率非常低，因为我有两个相同值的版本，一个作为对象数组，另一个作为对象（我用它来创建 select 元素）。

示例：

timezonesArrOfObj = {
    { value : "Europe/Dublin", string : "(GMT) Dublin"},
    { value : "Europe/Lisbon", string : "(GMT) Lisbon"},
    { value : "Europe/London", string : "(GMT) London"}
}

timezonesObj = {
    "Europe/Dublin" : "(GMT) Dublin",
    "Europe/Lisbon" : "(GMT) Lisbon",
    "Europe/London" : "(GMT) London"
}

目前，当我想显示值时，我这样做：

{{ timezonesObj[element.Timezone] }}

然而，重用 timezonesArrOfObj 会更有效率，但我如何将正确的键与 element.Timezone 的值相关联以显示正确的 timezonesArrOfObj[ (index of key == element.Timezone) ].string？

顺便说一句，我需要 timezonesArrOfObj，因为我想确定 select 元素中列出时区的顺序。

// 编辑

合并 xSaber 的评论和 Vaibhav 的回复，我最终这样做了：

.filter('getObjString', function() {
    return function(args){
        return args.obj[_.findIndex(args.obj, { value : args.val })].string 
    };
});

和html：

{{ { val : element.timezone, obj : timezonesArrOfObj } | getObjString }}

Answer 1

如果能改用filter就好了。

如下所示：

app.filter('myFilter', function() {
  var timezonesArrOfObj = [
        { value : "Europe/Dublin", string : "(GMT) Dublin"},
        { value : "Europe/Lisbon", string : "(GMT) Lisbon"},
        { value : "Europe/London", string : "(GMT) London"}
    ];
  return function(input, arg){
    angular.forEach(timezonesArrOfObj, function(key, value){
      if(arg == key.value){
        console.log('yes they are equal');
        return key;
      }
    });
  };
});

在 HTML 中：

您只需在绑定结果的任何地方使用此过滤器即可：

{{element.timezone | myFilter}}

希望对您有所帮助。如有任何问题，请告诉我。

引用 angular {{ }} html 标记中对象的值

Referencing to the value of an object inside angular {{ }} html markup

javascript

arrays

angularjs

angular-material