2017-01-13 4 views
0

Я пытаюсь изменить представление, используя $ location.

Вот как я пытался это сделать.

Посмотреть

<body ng-app="myApp" ng-controller="testCtrl"> 

     <button ng-click="click();">Press</button> 

</body> 

Контроллер

var app = angular.module('myApp',[]); 

app.controller('testCtrl',function($scope,$location){ 


    $scope.click = function(){ 

     $location.path('/main'); 

    }; 

}); 

app.js

angular.module('myApp', [ 
    'ngRoute', 
    'myApp.view2', 
    'myApp.version' 
]). 
     config(['$locationProvider', '$routeProvider', function ($locationProvider, $routeProvider, testCtrl) { 
       $locationProvider.hashPrefix('!'); 

       $routeProvider 


         .when('/main', 
           { 
            templateUrl: '/view2.html', 
            controller: testCtrl 

           }) 

         .otherwise({redirectTo: '/view1'}); 
      }]); 

Так что, когда я нажимаю на кнопку I можно увидеть изменения URL-адреса из

http://localhost:8383/etest/index.html 

в

http://localhost:8383/etest/index.html#/main 

Как я могу это исправить?

+0

Помогает ли вам ответ от http://stackoverflow.com/questions/27941876/how-to-redirect-to-another-page-using-angular-js? –

+0

Нечего исправить. Это ожидаемое поведение. Но вы используете ng-route без какого-либо ng-view на странице index.html. Таким образом, основной вид не может отображаться нигде. https://docs.angularjs.org/api/ngRoute –

+0

попробуйте поместить это $ locationProvider.hashPrefix ('!'); .. JB говорит, что это не ошибка ... но если вы хотите увидеть URL-адрес другим, вы можете использовать режим html5. активируйте его с помощью $ locationProvider.html5Mode (true); –

ответ

0

Вы пропустили, чтобы включить ng-view.

<body ng-app="myApp"> 
<div ng-view></div> 
</body> 

// view2.html 
<div ng-controller="testCtrl"> 
     <button ng-click="click();">Press</button> 
</div> 

app.config(['$locationProvider', '$routeProvider', function ($locationProvider, $routeProvider, testCtrl) { 
      $locationProvider.hashPrefix('!'); 
      $routeProvider 
        .when('/main', { 
           templateUrl: 'templates/view2.html', 
           controller: testCtrl 
          }) 
        .otherwise({redirectTo: '/view1'}); 
     }]); 

    $scope.click = function(){ 

    $location.path('/contact'); //you are in main path, So give different path then only you can see the location change easily. 
$route.reload(); // reload the route 

};

 Смежные вопросы

  • Нет связанных вопросов^_^