1、angularjs 在后台管理系统中如何优雅的使用jQuery插件;2、使用jQuery的语法写的话会不会太乱;3、angular没那么多jQuery的UI插件,第三方贡献者提供的UI插件坑很多;4、大家在使用angular 写程序中遇到过那些坑,以及是如何解决了,求指点
认证0级讲师
1 and 2、关于jquery,用angularjs指令完全可以代替,一个好的单页面应用可以完全脱离jquery,因为单页面一般都比较大一点,每个模块之间要隔离开来,jquery的选择器(特别是id选择器)有可能导致每个模块互相影响,可能会很乱。不过不适用jquery是不现实的,我现在更多的使用指令$element来解决问题,迫不得已一定要用选择器而且必须优雅的话,那就给每个html片段加class,像下面的代码
jquery
angularjs
id
element
html
class
png](http://img.php.cn/upload/image/000/000/000/3b2dfc7c18e0251f892fc3af33efb56f-0.png)在指令中使用jquery选择器的话 $('.navBar').find('.class')这样来实现选择器
$('.navBar').find('.class')
3、bootstrap肯定不会没用过吧!而且bootstrap-ui早已经实现了angularjs指令的封装,比如:tabset分页导航,折叠菜单accordion,bootstrap模态框等等
bootstrap
bootstrap-ui
tabset
accordion
4、遇到的坑多了去了,不过踩过之后发现貌似人家那种解决方式才是最正确的,比如:(1)模态框
初始化模态框时定义了controller和windowClass,所以模态框的外层class就是selectDocOrCol,模态框的controller就是linkModalCtrl,controller不用再在页面上进行ng-controller="linkModalCtrl"这样的指定(2)ng-class="{}"一定不要忘了引号里还有个{}...多的就不说了,自己实践出来的坑才能很好的理解
controller
windowClass
selectDocOrCol
linkModalCtrl
ng-controller="linkModalCtrl"
使用Angularjs的第一要点就是要摒弃jquery的思想,既然选择了angular,就不要将angular和jquery放在一起使用,而且angular自带了一些常用的jquery方法,足够了。jquery-ui不是万能的,去找一些angular的ui库,如果不尽如人意就自己动手改造一下,不要拿来主义养成懒惰的心理,很多ui库都要兼容多种浏览器情况而导致代码回比较多,你这一个后台管理程序根本没必要,自己开发反而来的更快些。
不实用angular
封装在directive中即可,ng和用jq并不冲突。directiv封装的脏活累活,实际上还是dom操作。
如果不做移动端的话,直接用就可以了。用angular实现大方向上的页面跳转及数据操作,在需要的地方直接用jq插件就可以了。
1 and 2、关于
jquery
,用angularjs
指令完全可以代替,一个好的单页面应用可以完全脱离jquery,因为单页面一般都比较大一点,每个模块之间要隔离开来,jquery
的选择器(特别是id
选择器)有可能导致每个模块互相影响,可能会很乱。不过不适用jquery
是不现实的,我现在更多的使用指令$element
来解决问题,迫不得已一定要用选择器而且必须优雅的话,那就给每个html
片段加class
,像下面的代码png](http://img.php.cn/upload/image/000/000/000/3b2dfc7c18e0251f892fc3af33efb56f-0.png)
在指令中使用jquery选择器的话
$('.navBar').find('.class')
这样来实现选择器3、
bootstrap
肯定不会没用过吧!而且bootstrap-ui
早已经实现了angularjs
指令的封装,比如:tabset
分页导航,折叠菜单accordion
,bootstrap
模态框等等4、遇到的坑多了去了,不过踩过之后发现貌似人家那种解决方式才是最正确的,比如:
(1)模态框
初始化模态框时定义了
controller
和windowClass
,所以模态框的外层class
就是selectDocOrCol
,模态框的
controller
就是linkModalCtrl
,controller
不用再在页面上进行ng-controller="linkModalCtrl"
这样的指定(2)ng-class="{}"一定不要忘了引号里还有个{}
...多的就不说了,自己实践出来的坑才能很好的理解
使用Angularjs的第一要点就是要摒弃jquery的思想,既然选择了angular,就不要将angular和jquery放在一起使用,而且angular自带了一些常用的jquery方法,足够了。jquery-ui不是万能的,去找一些angular的ui库,如果不尽如人意就自己动手改造一下,不要拿来主义养成懒惰的心理,很多ui库都要兼容多种浏览器情况而导致代码回比较多,你这一个后台管理程序根本没必要,自己开发反而来的更快些。
不实用angular
封装在directive中即可,ng和用jq并不冲突。directiv封装的脏活累活,实际上还是dom操作。
如果不做移动端的话,直接用就可以了。用angular实现大方向上的页面跳转及数据操作,在需要的地方直接用jq插件就可以了。