AngularJS : storing the value of a scope variable

Question

I am a beginner at AngularJS, I tried the following code (from a tutorial) :

My view :

<div ng-app="app">
<div ng-controller="exempleCtrl">
   HELLO {{name}}!
</div>

My controller :

var app = angular.module("app", []);

app.controller("exempleCtrl", function($scope) {
$scope.name = "World"
});

For a reason, I want to add some js code to my view that uses the value of "name", to do that I have to store it in a variable .. but this doesn't work

<script language="JAVASCRIPT">
    var name = {{name}};
</script>

but I don't know how to do that .. help please :)

you have it in your scope, why not put it in your controller anyway. — Bon Macalindong
– Bon Macalindong, Commented May 17, 2016 at 6:26

Akbar Taghipour · Accepted Answer · 2016-05-18 12:39:59Z

2

This way is long but it works:

 <script type="text/javascript">
    setTimeout(function(){
        var name = angular.element(document.querySelector('[ng-controller="exempleCtrl"]')).scope().name;
        console.log(name)
    },5000)
 </script>

edited May 18, 2016 at 12:39

answered May 17, 2016 at 5:22

Akbar Taghipour

3348 silver badges25 bronze badges

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

2 Comments

Insaf Over a year ago

It returns "undefined".

Akbar Taghipour Over a year ago

sourdoughdetzel · Accepted Answer · 2016-05-17 00:08:18Z

1

You cannot use interpolation ("{{variable}}") syntax in javascript. Is there a reason you are trying to do logic in a script tag rather than in the controller itself? Your controller is meant to be your connection between logic and your view so you shouldn't need to add any tags to your html to do that logic.

answered May 17, 2016 at 0:08

sourdoughdetzel

6643 silver badges6 bronze badges

2 Comments

Insaf Over a year ago

I understand, but I need to do that in my case.

sourdoughdetzel Over a year ago

I don't want to be quick to make assumptions since every situation is unique, so could you expand a little bit on why you need to do it in your view in a script tag? That may help find a solution.

Bon Macalindong · Accepted Answer · 2016-05-18 04:01:51Z

1

If you really want to do this.

<div ng-app="app">
  <div id="myCtrl" ng-controller="exempleCtrl">
    {{name}}
  </div>

  <script>
    document.addEventListener('DOMContentLoaded', function() {
      var elem = document.getElementById('myCtrl');
      var name = angular.element(elem).scope().name;
      console.log(name);
    });

  </script>

See jsfiddle code

answered May 18, 2016 at 4:01

Bon Macalindong

1,32013 silver badges20 bronze badges

Collectives™ on Stack Overflow

AngularJS : storing the value of a scope variable

3 Answers 3

2 Comments

2 Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

2 Comments

2 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related