Ionic Modal Transition to any other view

ionic-v1
1

I have created a modal pop up and i have a button on modal to go to next view. How to do it?

2 
<button class="button button-block button-positive" ui-sref="app.main"></button>
3

It’s not like that. I am developing an Application that has a modal inside a tab and on that modal i have a button and I want to go from that button to a view.

So how should I create state of Modal and navigation?

4

@Sarswatikumarpandey

Can you paste your code into a Plunker?

E.g., http://plnkr.co/edit/pGwucVrTBDxSvw6z092h?p=preview

To display a modal:

  $ionicModal.fromTemplateUrl('templates/login-template.html', {
    scope: $scope,
    animation: 'slide-in-up',  // fade-in, reverse, slide-in-up
    focusFirstInput: true
  }).then(function(modal) {
    $scope.loginModal = modal;
  });

If the modal has a button, you can use ‘ui-sref’:

<button class="button button-outline" ui-sref="app.editor( {postId: item.post.id} )" translate="EDIT">

or ng-click=“logout()” to call a function in your controller that transitions to a new state via $state.go(‘app.editor’, {postId: item.post.id});.

To define a state:

  .state('app.main', {
    url: '/main',
    cache: false,
    views: {
      'menuContent': {
        templateUrl: 'templates/main-template.html',
        controller: 'MainController',
        resolve: {
          posts: function(PostsService) {
            return PostsService.findPosts();
          }
        }
      }
    }
  })

For example: https://github.com/Robinyo/Vardyger/blob/master/core/client/app/scripts/app.js

Ref:

1 Like
5

I tried that link in your Ref and the app is flawed:

Click Scientific Facts
Click More Facts
Click Home

Notice there is a Back button on the top-left. Click it.

Now you are back to the More Facts page. This is bad behavior as it will use up too much memory on the device as the user uses the app since the navigation stack just keeps getting bigger.