0

I have this page which links the input.countNum scope variable to the input with ng-model. The value which is displayed on the button shows fine. When you click the button on the first page, it navigates to the second page which also displays the scope variable. But the variable is reset to the default declaration value in the controller code.

How do I maintain the scope value from ng-model between pages within the same controller?

tab-dash.html

<ion-view view-title="Test">

  <ion-content class="padding">

    <div class="list">

        <label class="item item-input">
            <span class="input-label">Count</span>
            <input class="text-right" type="number" pattern="[0-9]*" ng-model="input.countNum">
        </label>

    </div>

    <button class="button button-full button-positive" ng-click="create()" ui-sref="tab.count">
        Count is ({{input.countNum}})
    </button>

  </ion-content>
</ion-view>

controller.js

.controller('DashCtrl', function($scope) {

    $scope.input = {
        countNum: 1
    };

    $scope.create = function() {
        // Logic here
    };


})

count.html

<ion-view view-title="Count">

    <ion-nav-bar class="bar-energized">
        <ion-nav-back-button class="button-clear">
            <i class="ion-arrow-left-c"></i> Back
        </ion-nav-back-button>
    </ion-nav-bar>

  <ion-content class="padding">

    <button class="button button-full button-positive">
        ({{input.countNum}})
    </button>

  </ion-content>
</ion-view>

app.js

  .state('tab', {
    url: "/tab",
    abstract: true,
    templateUrl: "templates/tabs.html"
  })

  // Each tab has its own nav history stack:

  .state('tab.dash', {
    url: '/dash',
    views: {
      'tab-dash': {
        templateUrl: 'templates/tab-dash.html',
        controller: 'DashCtrl'
      }
    }
  })

  .state('tab.count', {
    url: '/count',
    views: {
      'tab-dash': {
        templateUrl: 'templates/count.html',
        controller: 'DashCtrl'
      }
    }
  })
Chad
  • 1,531
  • 3
  • 20
  • 46
  • Not sure if this is the case, but it's a place where I would start looking - [angular dot notation](http://stackoverflow.com/questions/17606936/angularjs-dot-in-ng-model). In short, put your `count` property in some object in scope, so `ng-model` would have a reference to that object. – Ilya Luzyanin Mar 03 '15 at 20:19
  • @IlyaLuzyanin thank you for the comment. I stumbled upon this earlier and I made the changes to my project (and now to the code above), but the issue is still happening. The data I input is not persisting. – Chad Mar 03 '15 at 20:53

1 Answers1

1

Controllers are not shared between pages - a new instance is created each time the controller is used. You should not expect to be able to share data from a controller with anything outside the scope of that controller either. If you need to share data between pages or controllers, you should use a service or "value" object to maintain that state. Another option would be passing the data between the pages using the state params:

ui-sref="tab.count({ input: input })"

Note that Ionic uses the Angular UI Router project for its navigation logic, so the documentation there also applies to using Ionic.

Daniel Schaffer
  • 56,753
  • 31
  • 116
  • 165
  • For the `ui-sref` code in this answer, I'm assuming I need to modify the state params. Could you expand the answer on how to do this? I'm new to AngularJS and Ionic. – Chad Mar 03 '15 at 21:29
  • See the example in my answer - the object in the ui-sref directive will be passed to the tab.count page, and you'll be able to get those values from the $stateParams service, which can be injected into the controller. Ionic uses Angular UI Router for its navigation, so you can just use their documentation for reference: https://github.com/angular-ui/ui-router/wiki – Daniel Schaffer Mar 03 '15 at 21:54
  • This was not what I was hoping for but it is on-point. I ended up just adding some parameters to the routing. `.state('tab.firstTab', { url: "/details?parentID&field2" ... ` Thanks for the answer. – Chad Mar 09 '15 at 15:12