ionic移动开发流程api

 

整个项目架构下，我们需要关注的有

 

1.app.js 主模块的定义，以及其他公共模块，

angular.module().run().config()

2.index.html 模块启用，资源文件的引入，页面公共入口

3.子模块路由

• l app.js 子模块路由配置

$stateProvider

.state('demo1', {

url : "/demo1",

cache : false,

templateUrl : "templates/demo/demo1.html",

controller : 'DemoController'

})

 

• l 模板文件夹:templates/demo/demo1.html
• l 控制器 文件夹: controllers/Demo/DemoController.js(DemoController)

angular.module().controller()

 

4.公共服务和指令开发

angular.module.factory()

angular.module.directive()

 
index.html
    <link href="css/style.css" rel="stylesheet">
    <link href="css/common.css" rel="stylesheet">
    <link href="css/main.css" rel="stylesheet">
  <script src="js/controllers/Demo/DemoController.js"></script>
 
缺点:资源文件全局加载
访问  http://localhost:8080/hf-km_mweb/www/#/demo1

常用 界面组件(angular 范畴)

 

功能	代码参考
｛｛属性名｝｝	数据绑定对象，例如{{attr1}}这里会自动绑定控制层$scope.attr1。此标签可以出现在页面调用的js函数中，注意不能使用双引号和单引号了，如<a ng-click="gotoDetail({{item.planserialno}})">立即投资</a>
ng-click	标签的点击事件，<a ng-click="testService()">test</a>：点击此标签会触发控制器中的$scope.testService方法。当然ng-click还可以用于div,ul,li等标签中。
ng-submit	form表单提交事件，如<form ng-submit="submitData()">
ng-include	通常与div结合，表示页面包含，类似于jsp的include用于引用，如<div ng-include="'templates/foot.html'"></div>表示引用foothtml页面，这样做的好处是可以共享foot.html页面。
ng-model	用于绑定input,select 等表单提交界面，如<input type="text" ng-model="UserName" placeholder="用户名/手机号/邮箱" required/>，同样UserName与控制器中的$scope.UserName一一对应。
ng-repeat	循环，类似于el表达式的forEach,用于列表循环，例如<li ng-repeat="item in items"><h5>{{item.minsum}}元</h5></li>,item代表当个对象，items表示item的集合，items与$scope.items一一对应。
ng-show	绑定标签是否显示,如<ul ng-show='menuState.show'>，那么ul是否显示根据menuState.show来判断。
ng-disabled	通常用于控制按钮是否变灰。如<button ng-disabled='!form.$valid'>Submit</button>

其他高级主键

顶部下拉刷新

 

底部上拉刷新

 

select使用