Setting dynamic scope variables in AngularJs - scope.<some_string>

Erik Honn

I have a string I have gotten from a routeParam or a directive attribute or whatever, and I want to create a variable on the scope based on this. So:

$scope.<the_string> = "something".

However, if the string contains one or more dots I want to split it and actually "drill down" into the scope. So 'foo.bar' should become $scope.foo.bar. This means that the simple version won't work!

// This will not work as assigning variables like this will not "drill down"
// It will assign to a variables named the exact string, dots and all.
var the_string = 'life.meaning';
$scope[the_string] = 42;
console.log($scope.life.meaning);  // <-- Nope! This is undefined.
console.log($scope['life.meaning']);  // <-- It is in here instead!

When reading a variable based on a string you can get this behavior by doing $scope.$eval(the_string), but how to do it when assigning a value?

Erik Honn

The solution I have found is to use $parse.

"Converts Angular expression into a function."

If anyone has a better one please add a new answer to the question!

Here is the example:

var the_string = 'life.meaning';

// Get the model
var model = $parse(the_string);

// Assigns a value to it
model.assign($scope, 42);

// Apply it to the scope
// $scope.$apply(); <- According to comments, this is no longer needed

console.log($scope.life.meaning);  // logs 42

Collected from the Internet

Please contact [email protected] to delete if infringement.

edited at
0

Comments

0 comments
Login to comment

Related

From Dev

Create dynamic scope variables in AngularJs inside loop

From Dev

How to add Dynamic Scope variables to a for loop in angularjs?

From Dev

Dynamic templates and scope variables

From Dev

AngularJS - Dynamic scope fields

From Dev

Dynamic scope variable in angularjs

From Dev

AngularJs scope variables in console

From Dev

Testing AngularJS scope variables

From Dev

Is it possible to parse a string with scope variables angularjs ?

From Dev

AngularJS scope variable not setting properly

From Dev

AngularJS dynamic scope name in HTML

From Dev

Angularjs accessing scope for dynamic elements

From Dev

Fill angularjs scope with a dynamic array

From Dev

AngularJS: accessing scope variables in $routeProvider

From Dev

Angularjs $scope variables not updating in view

From Dev

Angularjs $scope variables not updating in view

From Dev

AngularJS: accessing scope variables in $routeProvider

From Dev

AngularJs tests (Chai+Karma): some scope variables are not updated

From Dev

Passing String scope variables as arguments to $http.get in AngularJS

From Dev

Elixir: setting variables with module-wide scope

From Dev

Angular, setting scope variables with two dots

From Dev

Setting a scope variable from a directive with AngularJS

From Dev

Angularjs: $scope vs scope

From Dev

AngularJS: scope(not $scope) of a promise

From Dev

Angularjs: $scope vs scope

From Dev

Get order of variables in scope after dynamic OrderBy

From Dev

some JavaScript variables missing in scope

From Dev

Using Dynamic Data-Model For $scope in AngularJs

From Dev

AngularJS Dynamic Template with indexed scope variable arrays

From Dev

AngularJS no expression replacement with dynamic data in scope?

Related Related

HotTag

Archive