Can't call controller by using urlRouterProvider Angular

Question

I try to make this Plunker to work, spent more then 5 hours, posting here was a last resort.

app.js

app.config(function($stateProvider, $urlRouterProvider) {

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

    // the pet tab has its own child nav-view and history
    .state('tab.pet-index', {
      url: '/pets',
      views: {
        'pets-tab': {
          templateUrl: 'pet-index.html',
          controller: 'PetIndexCtrl'
        }
      }
    })

    .state('tab.pet-detail', {
      url: '/pet/:petId',
      views: {
        'pets-tab': {
          templateUrl: 'pet-detail.html',
          controller: 'PetDetailCtrl'
        }
      }
    });

console.log('app load ...');

  // if none of the above states are matched, use this as the fallback
  $urlRouterProvider.otherwise('/tab/pets');

});

Here I call $urlRouterProvider.otherwise('/tab/pets')

But I fail to get controller:

app.controller('PetIndexCtrl', function($scope, PetService) {
  console.log('PetIndexCtrl load ...');
  $scope.pets = PetService.all();
});

What I do wrong here? please help,

Thanks,

towr · Accepted Answer · 2014-02-22 10:48:07Z

1

It seems to come down to the ion- prefix missing in several places.

When I change nav-view to ion-nav-view, tabs to ion-tabs etc, things seems to work.

plunkr

answered Feb 22, 2014 at 10:48

towr

4,1673 gold badges22 silver badges31 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

snaggs Over a year ago

thank you mate, you saved me time, didn't think about

Collectives™ on Stack Overflow

Can't call controller by using urlRouterProvider Angular

1 Answer 1

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related