# \[SOLVED\] localStorage and $scope binding

**URL:** <https://forum.ionicframework.com/t/solved-localstorage-and-scope-binding/10268>\
**Category:** uncategorized\
**Created:** [September 26, 2014, 5:14pm UTC](https://forum.ionicframework.com/t/solved-localstorage-and-scope-binding/10268 "2014-09-26T17:14:57Z")\
**Posts on this page:** 3\
**Page:** 1

<div class="post-metadata">

**Author:** ![quicoli](https://avatars.discourse-cdn.com/v4/letter/q/e56c9b/32.png) [@quicoli](https://forum.ionicframework.com/u/quicoli)\
**Post date:** [September 26, 2014, 5:14pm UTC](https://forum.ionicframework.com/t/solved-localstorage-and-scope-binding/10268/1 "2014-09-26T17:14:57Z")

</div>

Friends,

in my controller I have exactly this:

```
   .controller('JornadaCtrl', function($scope) {
    var getJornada = function(){
        if (!localStorage.Horas){
            localStorage.Horas = 8;
        }

        return parseInt(localStorage.Horas);
            
    }
    
    $scope.qtdeHoras = getJornada();
    
    $scope.salvar = function(){
        localStorage.Horas = $scope.qtdeHoras;
        alert($scope.qtdeHoras);
    }
   
})

```

As you can see, I have a property “qtdeHoras”, receiving value from getJornada function. In My view, this property “qtdeHoras” is bind to an input, like this:

```
<input type="number" ng-model="qtdeHoras"> <br/>
<tt> Value = {{qtdeHoras}}</tt>  

```

In the View, everything is OK, as value get changed in the input, the tt is updated. BUT, I also have a button triggering my “salvar()” function. If you look into it, you see I’m using an alert to display “qtdeHoras” value…and here is the problem.

When I open this view, “qtdeHoras” is “5”, so I change it to “8”. Binding shows this correctly, but when I click my button, is shown the first value “5”, not the “8”…

I can’t see what is wrong here… ☹

---

<div class="post-metadata">

**Author:** ![Calendee](https://sea1.discourse-cdn.com/ionicframework/user_avatar/forum.ionicframework.com/calendee/32/13656_2.png) [@Calendee](https://forum.ionicframework.com/u/Calendee)\
**Post date:** [September 26, 2014, 6:31pm UTC](https://forum.ionicframework.com/t/solved-localstorage-and-scope-binding/10268/2 "2014-09-26T18:31:32Z")

</div>

It’s hard to say for sure without a working sample.

However, I think you are running into a common problem. `$scope.qtdgeHoras = getJornada` is setting a “primitive”. It’s a simple value. When Angular binds the scope to the view, it uses “prototypal inheritance”. Because `$scope.qtdeHoras` is a primitive, it simply copies into the view. The view will update, but the `$scope` will not.

To avoid this, you need to use “dot notation”. Basically, it means assigning the model in your scope to a complex object like an array or object, rather than a primitive.

So, something like this:

```auto
 .controller('JornadaCtrl', function($scope) {
    $scope.data = {}; // Creates an object

    var getJornada = function(){
        if (!localStorage.Horas){
            localStorage.Horas = 8;
        }

        return parseInt(localStorage.Horas);

    }

    $scope.data.qtdeHoras = getJornada();

    $scope.salvar = function(){
        localStorage.Horas = $scope.data.qtdeHoras;
        alert($scope.data.qtdeHoras);
    }

})

```

FYI : Read this excellent explanation to understand this better. [https://github.com/angular/angular.js/wiki/Understanding-Scopes](https://github.com/angular/angular.js/wiki/Understanding-Scopes)

---

<div class="post-metadata">

**Author:** ![quicoli](https://avatars.discourse-cdn.com/v4/letter/q/e56c9b/32.png) [@quicoli](https://forum.ionicframework.com/u/quicoli)\
**Post date:** [September 26, 2014, 6:42pm UTC](https://forum.ionicframework.com/t/solved-localstorage-and-scope-binding/10268/3 "2014-09-26T18:42:21Z")

</div>

My friend, you are completely right!!! Thank you!!!
