2016-02-27 30 views
4

我在AngularJS 1中,我想通過引用具有對象的值來顯示我顯示的元素的值爲關鍵元素的價值。引用角度{{}}中的對象的值html標記

目前我的實現效率非常低,因爲我有兩個版本的相同值,作爲對象數組,另一個作爲對象(我用它來創建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 }} 
+1

如果您使用在您的項目lodash /下劃線庫,你可以: '{{timezoneArrOfObj [_ findIndex(timezoneArrOfObj,{值:element.Timezone})]。字符串}}' 相當困難,是的,可能最好將這個解耦成控制器的方法。 – xSaber

回答

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}} 

我希望這有助於。如有任何問題,請告訴我。