Eneste saqueador, No puedo hacer que los enlaces y pestañas del menú funcionen correctamente. Como puede ver, necesito hacer clic dos veces en la 'Ruta 1' para volver de las pestañas Ruta2, además, cuando hago clic dos veces en el enlace del menú 'Ruta 2', el contenido de las pestañas no se muestra.

Creo que esta es la parte relevante del código que importa:

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

  $urlRouterProvider.otherwise("/");

  $stateProvider
    .state('route1', {
      url: "/",
      templateUrl: "route1.html"
    })
    .state('DocumentoMasterView', {
      url: "/route2",
      templateUrl: "route2.html",
      controller: 'myAppController'
    })
    .state('DocumentoMasterView.A', {
      url: '/detail',
      templateUrl: 'route2.A.view.html',
      controller: 'myAppController'
    })
    .state('DocumentoMasterView.B', {
      url: '/image',
      templateUrl: 'route2.B.view.html',
      controller: 'myAppController'
    })
    .state('DocumentoMasterView.C', {
      url: '/submenu',
      templateUrl: 'route2.C.view.html',
      controller: 'myAppController'
    })

});

 myapp.controller('myAppController',['$scope','$state',function($scope, $state){
        $scope.tabs = [
           { heading: 'A View', route:'DocumentoMasterView.A', active:true},
           { heading: 'B View', route:'DocumentoMasterView.B', active:false },
           { heading: 'C View', route:'DocumentoMasterView.C', active:false }
        ];

        $scope.go = function(route){
           $state.go(route);
        };

        $scope.active = function(route){
           return $state.is(route);
        };

       $scope.$on('$stateChangeSuccess', function() {            
         $scope.tabs.forEach(function(tab) {
               tab.active = $scope.active(tab.route);
         });
       });