1.原因:AngularJS 版本更新至1.6后对地址做了特别处理。如:<a hret="#/someurl"> 在浏览器中被解析为“#!%2Fsomeurl”,导致路由无法跳转。

解决办法:如果您希望路由中没有哈希前缀,那么可以通过向应用程序添加配置块来恢复以前的行为如下:stackoverflow中的连接

appModule.config(['$locationProvider', function($locationProvider) {
$locationProvider.hashPrefix('');
}]);

2.ngRoute使用实例(mvc web项目为例子)

一 新建ASP.NET Web应用程序(.NET Framework),进入后选择mvc

二 使用nuget包管理安装angular1.6包,并添加文件夹结构如下

在BundleConfig.cs中添加如下代码

    bundles.Add(new ScriptBundle("~/bundles/angular").Include(
"~/Scripts/angular.js",
"~/Scripts/angular-route.js",
"~/Scripts/angular-animate.js"
)); bundles.Add(new ScriptBundle("~/bundles/app").Include(
"~/App_Myapp/js/app.js"
));

在—layout.cshtml中添加如下内容

app.js文件中内容如下:

var app = angular.module('myapp', ['ngRoute', 'ngAnimate']);

app.config(['$locationProvider', function ($locationProvider) {
$locationProvider.hashPrefix('');
}]);
app.config(['$routeProvider', function ($routeProvider) {
$routeProvider
.when('/App_Myapp/Index', {
controller: 'HomeController',
templateUrl: '/App_Myapp/views/Index.html'
})
.when('/App_Myapp/Table1', {
controller: 'HomeController',
templateUrl: '/App_Myapp/views/tables/Table1.html'
})
.when('/App_Myapp/Table2', {
controller: 'HomeController',
templateUrl: '/App_Myapp/views/tables/Table2.html'
})
.otherwise({ redirectTo: '/App_Myapp/Index' });
}]); app.controller('HomeController', ['$scope', function ($scope) {
$scope.title = "这是一个AngularJS应用程序";
}]);

点击运行即可

ngRoute 配置路径不能跳转问题的更多相关文章

  1. 从零开始搭建口袋妖怪管理系统(2)-借助ngRoute实现详情页面跳转

    一.目标 上一次我们用Angular1.x完成了简单的口袋妖怪展示列表页面,现在我们想要了解口袋妖怪更多的信息,但是发现原有单行表格可能容纳不下口袋妖怪的所有信息,所以现在我们需要一个口袋妖怪详情界面 ...

  2. nginx配置http强制跳转https

    nginx配置http强制跳转https 网站添加了https证书后,当http方式访问网站时就会报404错误,所以需要做http到https的强制跳转设置. 一.采用nginx的rewrite方法 ...

  3. Nginx 配置 http 强制跳转到 https

    个人真实配置 架构:Nginx 反向代理 + Nginx 前端(LNMP) 在 Nginx 反向代理的 虚拟机主机配置文件中,作如下配置: upstream ilexa_cn { server 192 ...

  4. k8s中的nginx-ingress如何配置路径重定向

    k8s中的nginx-ingress如何配置路径重定向 一. 需求描述 路径重定向的一般应用场景: 调整用户浏览的URL,看起来更规范 为了让搜索引擎收录网站内容,让用户体验更好 网站更换新域名后 根 ...

  5. jsp中的路径与跳转

    在jsp(serlvet)中,页面的"变换"有两种方式,第一重定向,第二转发: 先说重定向,它的调用方式是这样的 response.sendredirect("uri&q ...

  6. cdnbest配置强制ssl跳转

    如何配置强制ssl跳转 1. 登陆用户站点,点击下图图标: 2. 如下图添加证书和开启强制ssl即可 hsts解释和作用: 国际互联网工程组织IETF正在推行一种新的Web安全协议HTTP Stric ...

  7. webpack配置路径及hash版本号,利用html-webpack-plugin自动生成html模板

    在项目中,因为需要经常更新文件,但是浏览器缓存问题导致js文件不是最新的,所有想办法添加hash值. 并配置webpack打包文件配置路径: 配置webpack打包文件路径,及非入口 chunk文件: ...

  8. 如何解决安装istio后istioctl命令每次使用都需要重新配置路径

    Kubernetes在安装istio后初次使用istioctl命令时会提示istioctl command not found 这时候如果在istio文件夹的根目录下配置 export PATH=$P ...

  9. 修改Nodejs内置的npm默认配置路径方法

    Nodejs 内置的npm默认会把模块安装在c盘的用户AppData目录下(吐槽一下:不明白为啥现在的软件都喜欢把资源装在这里) C盘这么小,肯定是不行的,下面一步步修改到D盘 1.打开cmd命令行, ...

随机推荐

  1. Spring-Mybatis使用到的依赖及配置

    日志(log4j) log4j.rootLogger=DEBUG,console,file log4j.appender.console = org.apache.log4j.ConsoleAppen ...

  2. 通过循环按行顺序为一个5×5的二维数组a赋1到25的自然数,然后输出该数组。试编程。

  3. Java语言学习day02--6月29日

    Java语言学习day02###01常用的DOS命令 * A: 常用的DOS命令 * a: 打开Dos控制台 * win+r--cmd--回车 * b: 常用dos命令 * cd.. : 退回到上一级 ...

  4. 关于Jupyter Notebook无法自动补全(Autocompletion),报错TypeError: __init__() got an unexpected keyword argument 'column' 的解决方案

    关于Jupyter Notebook无法自动补全(Autocompletion),报错TypeError: __init__() got an unexpected keyword argument ...

  5. 清除安装的Rancher、K8s

    #清除主机的所有容器.挂载.镜像(慎用) docker stop $(docker ps -aq) docker system prune -f docker volume rm $(docker v ...

  6. C++的三种继承方式详解以及区别

    目录 目录 C++的三种继承方式详解以及区别 前言 一.public继承 二.protected继承 三.private继承 四.三者区别 五.总结 后话 C++的三种继承方式详解以及区别 前言 我发 ...

  7. 全栈交叉编译X86完成过程经验分享

    1 CMAKE的交叉编译配置 主要是C和C++编译器的配置和SYSROOT的配置. set (CMAKE_SYSTEM_NAME "Linux") set (CMAKE_SYSTE ...

  8. 项目完成 - 基于Django3.x版本 - 开发部署小结

    前言 最近因为政企部门的工作失误,导致我们的项目差点挂掉,客户意见很大,然后我们只能被动进入007加班状态,忙得嗷嗷叫,直到今天才勉强把项目改完交付,是时候写一个小结. 技术 因为前期需求不明确,数据 ...

  9. [AcWing 51] 数字排列

    点击查看代码 class Solution { public: vector<vector<int>> res; vector<vector<int>> ...

  10. a commponent required a bean of type XXXXXX that could not be found-2022新项目

    一.问题由来 目前刚入职一家新公司不久,公司的新项目采用DDD驱动领域设计来进行开发,架构这一块使用的是阿里巴巴开源的最新框架COLA4.0的架构. 主要是这个框架里面的分层设计.主要分为四层:ada ...