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灵异代码事件的更多相关文章

  1. AngularJS进阶(十二)AngularJS常用知识汇总(不断更新中....)

    AngularJS常用知识汇总(不断更新中....) 注:请点击此处进行充电! app.controller('editCtrl',['$http','$location','$rootScope', ...

  2. 高效开发之SASS篇 灵异留白事件——图片下方无故留白 你会用::before、::after吗 link 与 @import之对比 学习前端前必知的——HTTP协议详解 深入了解——CSS3新增属性 菜鸟进阶——grunt $(#form :input)与$(#form input)的区别

    高效开发之SASS篇   作为通往前端大神之路的普通的一只学鸟,最近接触了一样稍微高逼格一点的神器,特与大家分享~ 他是谁? 作为前端开发人员,你肯定对css很熟悉,但是你知道css可以自定义吗?大家 ...

  3. J2EE进阶(十四)超详细的Java后台开发面试题之Spring IOC与AOP

    J2EE进阶(十四)超详细的Java后台开发面试题之Spring IOC与AOP 前言   搜狐畅游笔试题中有一道问答题涉及到回答谈谈对Spring IOC与AOP的理解.特将相关内容进行整理.    ...

  4. python3.4学习笔记(十四) 网络爬虫实例代码,抓取新浪爱彩双色球开奖数据实例

    python3.4学习笔记(十四) 网络爬虫实例代码,抓取新浪爱彩双色球开奖数据实例 新浪爱彩双色球开奖数据URL:http://zst.aicai.com/ssq/openInfo/ 最终输出结果格 ...

  5. iOS 11开发教程(十四)iOS11应用代码添加视图

    iOS 11开发教程(十四)iOS11应用代码添加视图 如果开发者想要使用代码为主视图添加视图,该怎么办呢.以下将为开发者解决这一问题.要使用代码为主视图添加视图需要实现3个步骤. (1)实例化视图对 ...

  6. Python进阶(十四)----空间角度研究类,类与类之间的关系

    Python进阶(十四)----空间角度研究类,类与类之间的关系 一丶从空间角度研究类 对象操作对象属性 class A(): address = '沙河' def __init__(self, na ...

  7. AngularJS进阶(二十四)AngularJS与单选框及多选框的双向动态绑定

    AngularJS与单选框及多选框的双向动态绑定      赠人玫瑰,手留余香.若您感觉此篇博文对您有用,请花费2秒时间点个赞,您的鼓励是我不断前进的动力,共勉! AngularJS 在 <in ...

  8. AngularJS进阶(十八)在AngularJS应用中集成科大讯飞语音输入功能

    在AngularJS应用中集成科大讯飞语音输入功能 注:请点击此处进行充电! 前言 根据项目需求,需要在首页搜索框中添加语音输入功能,考虑到科大讯飞语音业务的强大能力,遂决定使用科大讯飞语音输入第三方 ...

  9. 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)! 注:请点击此 ...

随机推荐

  1. Detailed Item Cost Report (XML) timed out waiting for the Output Post-processor to finish

    In this Document   Symptoms   Cause   Solution   References APPLIES TO: Oracle Cost Management - Ver ...

  2. 19 Handler 总结

    Handler 一, 回顾异步任务 AsyncTask 二, android 使用线程的规则 1,在主线程 不能做阻塞操作 2,在主线程之外的线程不能更新Ui 三, Handler的作用 1,在子线程 ...

  3. [ExtJS5学习笔记]第三十一节 sencha extjs 5使用cmd生成的工程部署到tomcat服务器

    本文地址:http://blog.csdn.net/sushengmiyan/article/details/42940883 本文作者:sushengmiyan ------------------ ...

  4. 详解EBS接口开发之采购申请导入

    更多内容可以参考我的博客  详解EBS接口开发之采购订单导入 http://blog.csdn.net/cai_xingyun/article/details/17114697 /*+++++++ ...

  5. iOS中让Settings Bundle中的变化立即在App中反应出来的两种方法

    大熊猫猪·侯佩原创或翻译作品.欢迎转载,转载请注明出处. 如果觉得写的不好请多提意见,如果觉得不错请多多支持点赞.谢谢! hopy ;) 为了能够在Settings Bundle中的变化在进入App后 ...

  6. Android开发学习之路--网络编程之xml、json

    一般网络数据通过http来get,post,那么其中的数据不可能杂乱无章,比如我要post一段数据,肯定是要有一定的格式,协议的.常用的就是xml和json了.在此先要搭建个简单的服务器吧,首先呢下载 ...

  7. gradle编译自定义注解(annotation)的未解决问题

    最近把一个用eclipse构建的项目,加上了Gradle脚本,用它来编译.虽然最后编译是显示BUILD SUCCESSFUL,但是在编译过程中,却打印出一大堆栈信息,似乎是在编译我自定义的注解时出现的 ...

  8. HMM:隐马尔科夫模型-前向算法

    http://blog.csdn.net/pipisorry/article/details/50722376 目标-解决HMM的基本问题之一:已知HMM模型λ及观察序列O,如何计算P(O|λ)(计算 ...

  9. 盘点:2016中国百强地产CIO高峰论坛的8大看点

    2016年中国百强地产CIO高峰论坛将于2016年6月16日至18日在浙江湖州举行,届时百余位地产公司CIO将出席大会,共同探讨新形势下如何重塑IT价值,增强地产公司的市场竞争力和盈利能力. 此次大会 ...

  10. [C++学习历程]基础部分 C++中的函数学习

    本文地址:http://blog.csdn.net/sushengmiyan/article/details/20305815 作者:sushengmiyan 一.静态变量: 局部变量是线程到达定义的 ...