$scope variable is treated as string - AngularJs

Question

I have declared and initialized few Scope variables and want to access them dynamically, but when I try to access a variable from html file, that variable is treated as a string.

JS Code-

$scope.abc3txt = "Hello";
$scope.abc2txt = "hello everyone";
$scope.abc1txt = "hello 123";

There is a number with every variable like 3,2,1 between abc"number"text.

I want to access the variable value according to the number in my html file.

HTML code-

<h4>{{abc+a.status+txt}}</h4>

a.status has some value like 1,2 or 3.

This prints like "abc3txt" in html, instead of returning the initialised value of "$scope.abc3txt" variable.

Please someone help..

Use an array or object! Variable variables are madness. $scope.abc[3] = { txt: 'Hello' }, or just $scope.abc[3] = 'Hello' or probably just $scope.abc = ['Hello', 'hello ...', ..]. This can be accessed unambiguously. — deceze
– deceze ♦, Commented May 17, 2016 at 8:28

deceze · Accepted Answer · 2016-05-17 08:52:20Z

3

I don't know if it can be done with $scope directly. A way would be to save those values in an object:

$scope.values = {
   abc3txt: "Hello",
   abc2txt: "hello everyone",
   abc1txt: "hello 123"
};

And in you view you could access them like this:

{{values['abc' + a.status + 'txt']}}

EDIT: The best alternative would be to use the controllerAs syntax. Suppose you have in controller:

var vm = this;
vm.abc3txt = "Hello";
vm.abc2txt = "hello everyone";
vm.abc1txt = "hello 123";

Then in your view: {{vm['abc' + a.status + 'txt']}}

edited May 17, 2016 at 8:52

deceze♦

525k89 gold badges806 silver badges954 bronze badges

answered May 17, 2016 at 8:30

Spartak Lalaj

4296 silver badges13 bronze badges

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

4 Comments

Walfrat Over a year ago

From HTML you'll need an intermedairy field. Of you'll need to use controllerAs syntax to be able to do that.

sajalsuraj Over a year ago

Can we use ";" semicolon inside object, Only comma can be used right ?

Spartak Lalaj Over a year ago

Yes, to separate fields from one another in an object, you need to use comma, if you mean that with your question!

sajalsuraj Over a year ago

Thanks for the help @SpartakLalaj for making me understand things.. It worked!!

FDavidov · Accepted Answer · 2016-05-17 08:40:46Z

3

Dynamic generation of variable names in the way you are seeking is, in all possible perspective, a very, very, SUPER-VERY bad practice, and this regardless of the support (or lack of it) a language may have. Having said that, arrays is the right way to go.

answered May 17, 2016 at 8:40

FDavidov

3,7556 gold badges27 silver badges72 bronze badges

Comments

MarcoS · Accepted Answer · 2016-05-17 09:04:28Z

3

You absolutely shouln't use variables namese that way, in javascript...
Consider using arrays...
Something like this should help:

In the controller:

$scope.a = {};
$scope.a.status = 2;
$scope.abctxt = [ "hello 123", "hello everyone", "Hello" ];

And, in the template:

<h4>{{ abctxt[a.status - 1] }}</h4>

edited May 17, 2016 at 9:04

answered May 17, 2016 at 8:30

MarcoS

17.8k27 gold badges101 silver badges189 bronze badges

1 Comment

MarcoS Over a year ago

Just because you used 1, 2, 3 for the names of your variables, so I supposed your array was 1-based. If it is 0-based (0,1,2,...), you can avoid -1...

Collectives™ on Stack Overflow

$scope variable is treated as string - AngularJs

3 Answers 3

4 Comments

Comments

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

4 Comments

Comments

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related