ionic入门教程第二十课-在微信中使用ionic的解决方案(开源框架)

来源:互联网 发布:在linux部署测试环境 编辑:程序博客网 时间:2024/06/13 13:09
OniPlatform在ionic的基础上配置ocLazyLoad,使得项目满足微信应用-单页面表现的需求,使得单页面访问,不会因为项目的庞大而造成读取缓慢,加快启动项目的速度。拆分ionic视图控制器的绑定,使之底层的服务能够用于pc端,pc端的页面使用bootstrap编写,用ionic的控制器和服务支持。使用此框架要遵循一下规定(以下以移动端路径说明,pc端在最前面加上ionicforpc):1、命名规则①文件夹命名全部小写②文件命名以首字母大写的驼峰式命名③服务以Service结尾④控制器以Ctrl结尾⑤指令以Directive结尾2、文件存放路径①所有服务放于js/services②所有控制器放于js/controllers③所有指令放于js/directives④所有工具类放于js/util⑤所有的html文件放于templates⑥路由在App.js中定义⑦所有的文件都要在Config.js文件中写明路径3、发布(发布文件路径为www/dest,相对路径不变,可以直接拷贝里面的文件发布)①首次使用运行firstbuild.bat,安装相关插件②首次发布运行buildall.bat,压缩js、css、html、image,拷贝lib里面的文件和index.html③只修改js,再次发布,运行buildjs.bat④只修改css,再次发布,运行buildcss.bat⑤只修改html,再次发布,运行buildhtml.bat⑥只修改image,再次发布,运行buildimage.bat⑦增加lib里面的文件,最好重新buildall4、按需加载的实现①按需加载html,在路由中配置属性templateUrl: 'templates/xx.html',prefetchTemplate:false,不会提前加载html②按需加载js,在路由中配置resolve: loadSequence('DashArgs'),resolve: loadSequence('DashCtrl'),resolve: loadSequence(['DashCtrl','DashService','MainService'])  resolve:预载入  使用预载入功能,可以预先载入一系列依赖或者数据,然后注入到控制器中。  在路由中的resolve,能够保证在路由到达前载入数据保证(promises).  预载入对象需要一个对象,这个对象的key纪要注入到控制器的依赖,这个对象的值为需要被载入的服务。  如果传入的是字符串,路由会视图匹配已经注册的服务。  如果传入的是函数,该函数会被注入,并且该函数返回的值便是控制器的依赖之一。  如果该函数返回一个数据保证(promise),这个数据保证将在控制器被实例化前被预先载入并且数据会被注入到控制器中。  loadSequence:自定义的加载js文件的方法,返回的是一个数据保证(promise)。resolve会保证在控制器被实例化之前载入相关数据。  loadSequence接受三种格式的参数。  第一种单个文件名称(该名称需要在Config.js中配置真实的文件路径)。  第二种一个文件名称的数据对象(要求同上)。  第三种单个的数组对象名称(该名称需要在Config.js中配置相应的文件名称的数组对象)  建议使用第三种格式的参数,提供一个数组对象的名称,在Config.js中匹配对应的数组对象,再通过遍历数组对象,匹配单个文件真实的文件路径,实现加载。③按需加载css文件,在对应的服务中调用 $ocLazyLoad.load( [{type: 'css', path: 'css/ChatsStyle.css'}]),需要注入服务$ocLazyLoad。  注意需要写在它特有的服务中,不要写在多个界面通用的服务里面。也可以使用按需加载js文件的方式,在配置表中配置。5、相关规范①服务是按照界面区分的,不是按照功能区分的。②在index.html中使用的服务和指令需要在index中使用script标签加载相关文件。  在index编译完成启动app之后才会触发路由6、关于自由复制    在ion-content中设置 overflow-scroll="true"    在需要的复制的对象增加样式selectable    .selectable{      -webkit-user-select: auto;      -moz-user-select: all;      -ms-user-select: all;      user-select: all;    }
项目在github上面:https://github.com/xiaohuoni/ionic-for-wechat
希望大家帮我看看,有可以优化的地方,请直接联系我,万分感激!
新浪微博:小虎Oni微信公众号:ionic__
2 0
原创粉丝点击