Ionic view app $state.go and ui-sref not working

Question

I have a problem when I try to change the view on the ionic view app for IO'S ( I don't prove the android app). I see that is a app bug and it has a solution but this doesn't work for me.

info bug : https://blog.appery.io/2015/09/how-to-fix-ios9-angular-webview-issue/ info bug 2: http://blog.ionic.io/ios-9-potential-breaking-change/

My ionic info is:

Cordova CLI: 5.3.3
Ionic Version: 1.1.0
Ionic CLI Version: 1.7.7
Ionic App Lib Version: 0.6.3
ios-deploy version: 1.8.2 
ios-sim version: 5.0.2 
OS: Mac OS X El Capitan
Node Version: v4.1.1
Xcode version: Xcode 7.0.1 Build version 7A1001

and my app.js is:

$stateProvider

      .state('landing', {
        url: '/',
        templateUrl: 'templates/landing/landingView.html',
        controller: 'landingController'
      })
      .state('login', {
        url: '/login',
        templateUrl: 'templates/landing/login/loginView.html',
        controller: 'loginController'
      })
      .state('register', {
        url: '/register',
        templateUrl: 'templates/landing/register/registerView.html',
        controller: 'registerController'
      })
      .state('forget', {
        url: '/forget',
        templateUrl: 'templates/landing/forget/forgetView.html',
        controller: 'forgetController'
      })
      .state('index', {
        abstract: true,
        //url: '/',
        views: {
          '@' : {
            templateUrl: 'templates/abstractView.html',
            controller: 'AppCtrl'
          },
          'sideNavMenu@index': {
            templateUrl: 'templates/modules/sideBar/sideNavBar.html',
            controller: 'sideNavController'
          },
          'footerMenu@index': {  //tabs views
            templateUrl: 'templates/modules/footerMenu/footerMenu.html',
            controller: 'footerMenuController'
          }
        }
      })
      .state('tab1', {
        parent: 'index',
        abstract:true,
        url: '/tab1',
        views: {
          'tab1View@index': {
            templateUrl: 'templates/tab1/tttt.html',
            controller: 'tabs1Controller'
          }
        }
      })
      .state('tab2',{
          parent: 'tab1',
          url: '/tab2',
          views:{
              'tab2View@index': {
                  templateUrl: 'templates/tab2/tttt.html',
                  controller: 'tab2Controller'
              }
          }
      })
      .state('tab3',{
          parent: 'tab1',
          url: '/tab3',
          views:{
              'tab3View@index': {
                  templateUrl: 'templates/tab3/tttt.html',
                  controller: 'tab3Controller'
              }
          }
      })
      .state('tab4',{
          parent: 'tab1',
          url: '/tab4',
          views:{
              'tab4View@index': {
                  templateUrl: 'templates/tab4/rrr.html',
                  controller: 'tab4Controller'
              }
          }
      })

      .state('subtabs', { //tabs inside tabs
        parent: 'tab1',
        abstract:true,
        url: '/subtabs'
      })
      .state('subtabs.subtab1',{
        parent: 'subtabs',
        url: '/subtab1',
        views: {
          'subtab1@mobile': {
            templateUrl: 'templates/subtab/tab1/tab1.html',
            controller: 'subtab1Controller'
          }
        }
      })
      .state('subtabs.subtab2',{
        url: '/subtab2',
        views: {
          'etcetc@torneos.disponibles':{
            templateUrl: 'templates/subtab2/subtabs21/ssss.html',
            controller: 'subtab21Controller'
          },
          'etc1etc2@mobile': {
            templateUrl: 'templates/subtab2/subtabs22/ddddd.html',
            controller: 'subtab22Controller'
          }

        }
      })
      .state('subtabs.subtab3',{
        parent: 'subtabs',
        url: '/subtab3',
        views: {
          'etcetc3@mobile': {
            templateUrl: 'templates/subtab/subtabs3/asdasd.html',
            controller: 'subtab3Controller'
          }
        }
      })

Obviously, the names and dirs are fakes... this state with real names works for me, I only want to explain the idea.

I have a one landing with : login,register,etc views and when I pass this view after I go to the index page etc etc, this index page is an abstract view with tabs (4 tabs) and in one tab I have tabs inside again.

I render tabs with subviews for module it. My problem is that in the browser, and Xcode debug simulation, etc it works... but in the ionic view app it doesn't work. (I try patch and it's not working at all). I prove this with href , ui-sref, state.go() ... and nothing. I need help please

Thanks!! =)

score 0 · Answer 1 · answered Oct 30 '15 at 13:40

Had similar problems. And what i recommend to do:

Apply patch: https://gist.github.com/IgorMinar/863acd413e3925bf282c Just place it in your project directory, add a <script src=...> to index.html in your ionic project and a dependency in app.js like that: angular.module('myApp', ['ngRoute', 'ngIOS9UIWebViewPatch'])
Download and replace latest angular (https://code.angularjs.org/1.4.7/) in [your ionic project]/www/lib/js/angular
Files are: angular-animate.js, angular-sanitize.js, angular.js

Include them instead of ionic-bundle.js, so your index.html head will look like:

<script src="lib/ionic/js/ionic.js"></script>
<script src="lib/ionic/js/ionic-angular.js"></script>

<script src="lib/ionic/js/angular-ui/angular-ui-router.js"></script>

<script src="angular-ios9-uiwebview.patch.js"></script>
<!-- cordova script (this will be a 404 during development) -->
<script src="cordova.js"></script>

Update XCode to 7.1
Open project [your project name].xcodeproj in [your ionic project]/platforms/ios. XCode will offer to fix few warnings, please do it, just for any case.
Compile and run a project from XCode

After all that steps my project started to work

Ionic view app $state.go and ui-sref not working

1 Answers1