1.设置代码结构
index.html放在外围 templates 包含 tabs.html 及 所有视图
2.为了便于修改 api 接口,在config.js 中 使用常量(EVN),标记所有接口
3.app.js
设置平台 $ionicPlatform定义抬头 $httpProvider.defaults.header配置全局风格 $ionicConfigProvider.platform进行路由配置 $stateProvider
state { 1.url 状态 2.templateUrl 文件位置 3.controller 控制器 }
4.directives.js 存放 自定义标签
strictrequirescopelink
5.controller 控制器 一个视图 对应一个控制器
通过 $http 请求数据
$http({ method:'', url:'', data:{}}).success(function(){}).error(function(){})
通过
$scope.$on('$ionicView.beforeEnter',function(event,viewData){ viewData.enableBack = true;})
监听视图状态
详情页 $stateParams 获取对应的id
选项卡数据 使用对象 两个属性对应 标题 及 数据
操作 iframe 中的内容的CSS样式 contentWindow.document
使用对象,绑定 $rootScope 随着页面的跳转 绑定数据 最后一起提交 创建订单数据
$state.go('tab.home') 实现点击时 页面跳转
$scope.$on 接收服务传递过来的数据
formData 以表单的形式 向后台传递 key value
6.servie 服务
通过 $resource 简化代码
var resource = $resource();var params = {}resource.save(params,function(data){})
7.自定义全局提示框
.factory('TipService', ['$timeout','$rootScope', function($timeout,$rootScope) { return { message: null, setMessage: function(msg) { $rootScope.tip = {}; $rootScope.tip.message = msg; $rootScope.tip.show = true; var _self = this; $timeout(function() { _self.clear(); }, 2000); }, clear: function() { $rootScope.tip.message = null; $rootScope.tip.show = false; } };}])
8.使用canvas 的api 实现 图片的显示 及 压缩