简体   繁体   English

Angular中的路由问题(URL中出现“!”)

[英]Routing issue in Angular (happening a “!” in URL)

I'm using Angular ngRoute . 我正在使用Angular ngRoute

When I'm trying to route to another page, it is not redirecting in URL. 当我尝试路由到另一个页面时,它没有在URL中重定向。 It shows as http://localhost:58317/#!#%2Fstudents 它显示为http://localhost:58317/#!#%2Fstudents

myApp.js myApp.js

var app = angular.module('MyApp', ['googlechart', 'ngRoute'])
app.controller('HomeCtrl', function ($scope) {
    $scope.msg = "Hello Angular.....";
})

app.config(function ($routeProvider, $locationProvider) {
    $locationProvider.html5Mode(false);
    $locationProvider.hashPrefix("!");
    $routeProvider.when("/home", {
        templateUrl: '/Home/part1',
        controller: 'routeDemoFirstController'
    }).
    when('/contact', {
        templateUrl: '/Home/part2',
        controller: 'routeDemoSecondController'
    }).
     when('/students', {
         templateUrl: '/Home/part2',
         controller: 'routeDemoSecondController'
     })
})

Index.cshtml This is my .cshtml code Here i write anchor tag Index.cshtml这是我的.cshtml代码在这里我写锚标记

<div class="row">
    <div>
        <a href="/#/home">Home</a>
        <a href="#/contact">Courses</a>
        <a href="#/students">Students</a>
    </div>
    <ng-view></ng-view>
</div>

You are using the hash-bang prefix: 您正在使用hash-bang前缀:

$locationProvider.hashPrefix("!");

It signicates that your URL should be: 它表示您的网址应为:

<a href="#!/home">Home</a>

If you want to remove the ! 如果要删除! from the URL ( you can also remove the # ), you can check this answer . 从网址( 您也可以删除# )中,可以检查此答案

remove 去掉

$locationProvider.hashPrefix("!");

Make changes to html 对html进行更改

<div class="row">
        <div>
            <a ng-href="#!/home">Home</a>
            <a ng-href="#!/contact">Courses</a>
            <a ng-href="#!/students">Students</a>
        </div>
        <ng-view></ng-view>
    </div>

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM