AngularJS进阶(十四)AngularJS灵异代码事件
AngularJS灵异代码事件
事情原委
router_sys.js源代码如下:
自己在html路由跳转的代码如下:
但是在实际路由过程中,却路由到了下面的状态,相应的页面中去。
诡异的是在UC上第一次路由正常,第二次还是路由到下面的状态!路由命名是没有问题的,却执行到别路由中去了。费解!
驱除内鬼
内鬼一时还真找不出来。
尝试通过编写点击事件在函数内路由至所需页面,结果还是不可达。
<a class="btn btn-success btn-sm" id="butAdd" ng-click="doAdd()">新增药店</a> //路由至新增药店 $scope.doAdd = function(){ alert("SHQ"); $state.go('SHQ'); };
提示错误如下:
Could not resolve 'SHQ' from state 'shopManag'
把路由中的shop_set_dtl.html页面注释掉,居然还能路由!地址居然还显示!如何是好?
这个问题已经超出了自己的能力范围,实在是没有办法!
真相大白
呵呵....不要管我,让我哭会!为自己的过错哭会
原来自己写有3个路由分别为router.js、router_sys.js、router.shop.js,我就纳了闷了,我说怎么该路由死活都不对呢,原来问题就出在第一个路由上。第一个路由中的路由这是自己给自己埋的一颗雷啊!雷区如下:
//TODO(待考虑) /*-----------------------药店详情维护------------------------*/ .state('shopDtlManag', { url: '/shopDtlManag/', views: { //注意这里的写法,当一个页面上带有多个ui-view的时候如何进行命名和视图模板的加载动作 '': { templateUrl: 'sys_tpls/rightInfoList.html' }, 'sys_banner@shopDtlManag': { templateUrl: 'sys_tpls/sys_banner.html' }, 'rightContent@shopDtlManag': { templateUrl: 'sys_tpls/shop_set_dtl.html' } } })
这样就不难解释为何会出现以上灵异事件了。
将之替换为如下代码,问题迎刃而解!
/*---------------------------新增药店-----------------------------*/ .state('shopAdd', { url: '/shopAdd/', views: { //注意这里的写法,当一个页面上带有多个ui-view的时候如何进行命名和视图模板的加载动作 '': { templateUrl: 'sys_tpls/rightInfoList.html' }, 'sys_banner@shopAdd': { templateUrl: 'sys_tpls/sys_banner.html' }, 'rightContent@shopAdd': { templateUrl: 'sys_tpls/shop_add.html' // 路由至新增药店页面 } } })
亡羊补牢
既然错误已犯,自己就要悔过了。必须得把这可盲雷拆掉!
不过看过代码,感觉这可暗雷不好拆除。当初自己是本着药店端和后台管理端可以分开登录来设计的。
当初的项目需求是实现两个管理端分别进入自己的登录界面,分别为index_sys.html和index_shop.hml。而自己起初是将两者置于一起的,后来为了分离后,应对交易调用错误如何处置的情况,故保留了index.html。
拆雷时,须将index.html与router同时拆除。
其实,经过对比发现router_sys.js与router.shop.js的唯一不同之处在于以下划红线部分代码:
$stateProvider
.state('index', {
url: '/index',
views: {
'': {
templateUrl: 'sys_tpls/home.html'
},
'sys_login@index': {
templateUrl: 'sys_tpls/sys_login.html'
}
}
})
经过不断测试,自己必须将这颗暗雷拆除。
经过调试,查出暗雷之后,程序运行正常!╰( ̄▽ ̄)╮
美文美图
AngularJS进阶(十四)AngularJS灵异代码事件的更多相关文章
- AngularJS进阶(十二)AngularJS常用知识汇总(不断更新中....)
AngularJS常用知识汇总(不断更新中....) 注:请点击此处进行充电! app.controller('editCtrl',['$http','$location','$rootScope', ...
- 高效开发之SASS篇 灵异留白事件——图片下方无故留白 你会用::before、::after吗 link 与 @import之对比 学习前端前必知的——HTTP协议详解 深入了解——CSS3新增属性 菜鸟进阶——grunt $(#form :input)与$(#form input)的区别
高效开发之SASS篇 作为通往前端大神之路的普通的一只学鸟,最近接触了一样稍微高逼格一点的神器,特与大家分享~ 他是谁? 作为前端开发人员,你肯定对css很熟悉,但是你知道css可以自定义吗?大家 ...
- J2EE进阶(十四)超详细的Java后台开发面试题之Spring IOC与AOP
J2EE进阶(十四)超详细的Java后台开发面试题之Spring IOC与AOP 前言 搜狐畅游笔试题中有一道问答题涉及到回答谈谈对Spring IOC与AOP的理解.特将相关内容进行整理. ...
- python3.4学习笔记(十四) 网络爬虫实例代码,抓取新浪爱彩双色球开奖数据实例
python3.4学习笔记(十四) 网络爬虫实例代码,抓取新浪爱彩双色球开奖数据实例 新浪爱彩双色球开奖数据URL:http://zst.aicai.com/ssq/openInfo/ 最终输出结果格 ...
- iOS 11开发教程(十四)iOS11应用代码添加视图
iOS 11开发教程(十四)iOS11应用代码添加视图 如果开发者想要使用代码为主视图添加视图,该怎么办呢.以下将为开发者解决这一问题.要使用代码为主视图添加视图需要实现3个步骤. (1)实例化视图对 ...
- Python进阶(十四)----空间角度研究类,类与类之间的关系
Python进阶(十四)----空间角度研究类,类与类之间的关系 一丶从空间角度研究类 对象操作对象属性 class A(): address = '沙河' def __init__(self, na ...
- AngularJS进阶(二十四)AngularJS与单选框及多选框的双向动态绑定
AngularJS与单选框及多选框的双向动态绑定 赠人玫瑰,手留余香.若您感觉此篇博文对您有用,请花费2秒时间点个赞,您的鼓励是我不断前进的动力,共勉! AngularJS 在 <in ...
- AngularJS进阶(十八)在AngularJS应用中集成科大讯飞语音输入功能
在AngularJS应用中集成科大讯飞语音输入功能 注:请点击此处进行充电! 前言 根据项目需求,需要在首页搜索框中添加语音输入功能,考虑到科大讯飞语音业务的强大能力,遂决定使用科大讯飞语音输入第三方 ...
- AngularJS进阶(十五)Cookie 'data' possibly not set or overflowed because it was too large
Cookie 'data' possibly not set or overflowed because it was too large (5287 > 4096 bytes)! 注:请点击此 ...
随机推荐
- Android图表库MPAndroidChart(十四)——在ListView种使用相同的图表
Android图表库MPAndroidChart(十四)--在ListView种使用相同的图表 各位好久不见,最近挺忙的,所有博客更新的比较少,这里今天说个比较简单的图表,那就是在ListView中使 ...
- 硬件模块化机器人操作系统 Hardware Robot Operating System (H-ROS)
原文网址:http://www.ros.org/news/2016/10/hardware-robot-operating-system-h-ros.html 推荐网址:https://h-ros.c ...
- 长度为N的数组乱序存放着0带N-1.现在只能进行0与其他数的swap操作,请设计并实现排序,必须通过交换实现排序。
void sort(int* arr, int len) { if (!arr) { return; } for (int i = 1; i < len; ++i) { while (arr[0 ...
- 查看4k对齐,激活.net framework 3.5
查看是否4k对齐 Win+R,打开运行窗口,在窗口中输入“msinfo32",组件”--“存储”--“磁盘”.然后可以在右边栏看到“分区起始偏移”,我们图例中有2个数值,分别是:32256字 ...
- 深入浅出如何解析xml文件---上篇
xml小伙伴们并不陌生,xml是可扩展标记语言,标准通用标记语言语言的子集,是一种用来标记电子文件使其具有结构性的标记语言.我们知道xml可以用dom与sax等方法进行解析,但是xml为什么要解析呢? ...
- OpenCV:Mat元素访问方法、性能、代码复杂度以及安全性分析
欢迎转载,尊重原创,所以转载请注明出处: http://blog.csdn.net/bendanban/article/details/30527785 本文讲述了OpenCV中几种访问矩阵元素的方法 ...
- 使用Myeclipse10.0自动生成搭建SSH框架(数据库表自动反向转换成Hibernate实体)实现用户登陆
我这里使用的数据库是mysql5.0 数据是上课用的.这些都不是重点,重要的是学会这个方法: 创建好数据库: create database jboadefault character set utf ...
- Solr 5.5.0 + tomcat 7.0.69 + zookeeper-3.4.6 Cloud部署
Solr介绍:Solr是一个独立的企业级搜索应用服务器,Solr基于Lucene的全文搜索服务器,同时对其进行了扩展,提供了比Lucene更为丰富的查询语言,同时实现了可配置.可扩展并对查询性能进行了 ...
- ubuntu opengl 开发
开发环境: eclipse,需要安装C++开发插件,在自带的源中查找安装C++开发工具包即可 下载安装gl库: sudo apt-get install libgl1-mesa-dev 下载安装glu ...
- Android开发学习之路--Notification之初体验
一般当我们收到短信啊,微信啊,或者有些app的提醒,我们都会在通知栏收到一天简单的消息,然后点击消息进入到app里面,其实android中有专门的Notification的类可以完成这个工作,这里就实 ...