AngularJS: Name a variable using another's variable value

Question

I'm new to AngularJS and I'm still exploring its possibilities. Currently I'm stuck with this problem: How can I name a variable using another's variable value?

For example I have something like this in my controller:

    $scope.item_foo = 'Foo';
    $scope.item_bar = 'Bar';

I can access the values with this:

    {{item_foo}}
    {{item_bar}}

So far so good, but now I want to display them dynamically. I have an object with 'foo' and 'bar' and I loop it with ngRepeat. How can I do something like that:

    {{item_{{variable_with_value_foo_or_bar}}}} // should print Foo and Bar

Thank you for any of your help!

mgilson · Accepted Answer · 2014-03-21 16:09:27Z

3

It seems like it would be better to use an object to store the data, rather than a bunch of things at the $scope level...:

$scope.item = {foo: 'Foo', bar: 'Bar'};
// ...
$scope.variable_with_value_foo_or_bar = 'foo';

Then access with:

{{item[variable_with_value_foo_or_bar]}}

edited Mar 21, 2014 at 16:09

answered Mar 21, 2014 at 16:03

mgilson

312k70 gold badges656 silver badges722 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

ohh2ahh Over a year ago

Thank you very much for your answer. Actually, my problem is not as easy as I wrote. It has a specific reason why I'm doing this. I'm sure it's not "best practice", but I'm still learning :)

Scott Rippey · Accepted Answer · 2014-03-21 16:19:59Z

1

Within your template, this refers to the current scope, so you can do:

{{ this[ 'item_' + variable_with_value_foo_or_bar ] }}

There are probably better ways to perform what you're trying to do, but hopefully this answers your question.

answered Mar 21, 2014 at 16:19

Scott Rippey

15.8k5 gold badges73 silver badges88 bronze badges

1 Comment

ohh2ahh Over a year ago

Thank you so much! This is exactly the solution I was looking for.

Collectives™ on Stack Overflow

AngularJS: Name a variable using another's variable value

2 Answers 2

1 Comment

1 Comment

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

1 Comment

1 Comment

Your Answer

Sign up or log in

Post as a guest

Linked

Related