2

Okay, this is a strange problem I've never had before and I didn't see anyone else having this problem on the Internet;

For starters, I'm using AngularJS and the $scope variables.

While using AngularJS i've noticed my variables are showing both the value that was set in the beginning of the controller, for example:

$scope.editMode = true;

And the value I have set for them in a function inside of the controller, which in that case the function was triggered by a click. For example:

$scope.disableEditMode = function() {$scope.editMode = false;}

I'm running an interval of a second in the controller to check the variable's value, which is showing me that it is true and then false, and so on...

Why is it changing by its own? Or why is it having both of the values? What's going on here?

By the way, I'm not sure if that's a reason for this problem, but on the click event which changes the variable value I'm also redirecting the user to another page that uses the same controller, which I thought it might reset that data for the variable but it is clearly not the case.

Thanks.

Ganapathy
  • 545
  • 1
  • 6
  • 23
shay.k
  • 503
  • 1
  • 7
  • 15
  • 1
    What do you mean by _having both values_? it can't possibly be `true` and `false` at the same time. – Mackan Nov 14 '16 at 12:55
  • @Mackan It shows true and the false and then true and then false and so on in the console – shay.k Nov 14 '16 at 12:56
  • 1
    Can you please add bit more of your code, like the template and the controller? People cannot test it just with that information. – lenilsondc Nov 14 '16 at 12:57
  • @LenilsondeCastro I can't share the whole controller, it's big and i don't want to reveal some of my code, since it belongs to the company i work in. but what specifically can i provide for you? it's a standard controller with variables and functions, the variable $scope.editMode is set to be true at the beginning and set to be false when the function disableEditMode() is triggered. nothing special really, but i would be happy to share more if needed – shay.k Nov 14 '16 at 13:01
  • @Mackan this is my interval: setInterval(function() { console.log($scope.editMode); }, 1000); – shay.k Nov 14 '16 at 13:02
  • 1
    So provide a fiddle reproducing this behaviour you are facing, don't need the entire program just the part that causes the problem. – lenilsondc Nov 14 '16 at 13:03
  • 1
    I'm just guessing, but I think you are accidentally calling `disableEditMode()` on your template. – lenilsondc Nov 14 '16 at 13:04
  • @LenilsondeCastro even so, how come it shows both true and false, shouldn't it just show false even if that's the case? I will also try to provide more details, but i can't understand what's happening so i will probably not be able to reproduce this bug – shay.k Nov 14 '16 at 13:07
  • 1
    Yes, but it can have more than what I guessed. As I told, we can't be totally sure without the piece of code to reproduce this. – lenilsondc Nov 14 '16 at 13:09
  • @LenilsondeCastro Is it possible that the controllers were duplicated? so i am actually seeing 2 intervals happening at the same time? – shay.k Nov 14 '16 at 13:10
  • 1
    Yes it is possible, you can log the `$scope.$$id` to see if they are different. – lenilsondc Nov 14 '16 at 13:12
  • @LenilsondeCastro $scope.$$id is undefined, how do i use it? – shay.k Nov 14 '16 at 13:16
  • 1
    Sorry I meant `$scope.$id` not `$scope.$$id`. My apologies. – lenilsondc Nov 14 '16 at 13:20
  • Let us [continue this discussion in chat](http://chat.stackoverflow.com/rooms/128063/discussion-between-shay-k-and-lenilson-de-castro). – shay.k Nov 14 '16 at 13:22
  • @shay.k Try to reproduce the error with a JSFiddle pls – Weedoze Nov 14 '16 at 13:36

1 Answers1

1

The normal javascript setInterval() is not part of Angular's scope.

Angular has it's own implementation, $interval, that will evaluate the scope correctly.

var timer = $interval(function() {
                console.log($scope.editMode);
            }, 1000);

You must include this in the controller though:

...controller('myController', function($scope, $interval)..

Also, another thing to check/correct is the scope variable if it's in some way in a child controller and used as ng-model. More here:

Community
  • 1
  • 1
Mackan
  • 6,200
  • 2
  • 25
  • 45
  • Thanks it works, but it's still showing the same thing – shay.k Nov 14 '16 at 13:16
  • Seems like somehow you've set the value on multiple scopes, or you're running several intervals through different scopes. Hard to say how or why with only the code you've provided. When you track down the error, be sure to check it using $interval though ;) – Mackan Nov 14 '16 at 13:22
  • I have figured i am actually using duplicated contollers in my project for some reason, so one controller has the correct values and one hasn't. Could i set a variable that will not depend on a controller? i thought of $rootScope but i understand it is not a good practice – shay.k Nov 14 '16 at 13:35
  • @shay.k Can't you separate the controllers instead? The second link I posted gives a nice example of how scopes can conflict. You can also have a look at https://docs.angularjs.org/api/ng/function/angular.extend if you want to use the same scope in two controllers. – Mackan Nov 14 '16 at 13:40