@@ -1137,6 +1137,27 @@ app.controller('pageMain2Ctrl', function($scope, $state) {
1137
1137
用` $state .params ` 就可以访问到路由上的参数
1138
1138
例如我们输入#/main/pageMain2/1,就会返回一个对象` Object {id: " 1" }`
1139
1139
1140
+ ### 页面之间通信数据
1141
+ ### 路由之间通信数据
1142
+ >不同页面之前的控制器之间通信数据
1143
+
1144
+ 在url上传递和接受(拼接参数到url上,然后用$loacion.search()接受)
1145
+ 思路就如同在路由上配置以下代码
1146
+ ` ` ` javascript
1147
+ .state (' page2' ,{
1148
+ url: ' /page2/:id/:name' ,// 参数用:params的形式,多个参数的话用/隔开
1149
+ templateUrl: ' template/page2.html' ,
1150
+ controller: ' page2Ctrl'
1151
+ })
1152
+ ` ` `
1153
+ 然后在控制器中用$state服务接受
1154
+ ` ` ` javascript
1155
+ app .controller (" page2Ctrl" ,function ($state ){
1156
+ $state .params .id
1157
+ $state .params .name
1158
+ })
1159
+ ` ` `
1160
+
1140
1161
### 一个视图多个ui-view
1141
1162
1142
1163
当一个视图拥有多个ui-view,例如下面这样,平时我们一般一个视图只有一个` ui- view` 的情况
@@ -1175,15 +1196,16 @@ app.controller('pageMain2Ctrl', function($scope, $state) {
1175
1196
})
1176
1197
` ` `
1177
1198
**ng路由**
1199
+ 1.下载ng路由文件
1178
1200
1179
- 1.加载ng路由模块, 引入angular. js之后
1201
+ 引入angular-route.js到项目中,放在angular. js之后,然后在代码里面引入 ` ngRoute ` 模块
1180
1202
1181
1203
` ` ` html
1182
1204
< script type= " text/javascript" src= " ../js/angular.js" >< / script>
1183
1205
< script type= " text/javascript" src= " ../js/angular-route.js" >< / script>
1184
1206
` ` `
1185
1207
1186
- 2.包含了 ngRoute 模块作为主应用模块的依赖模块
1208
+ 2.包含了` ngRoute` 模块作为主应用模块的依赖模块
1187
1209
` ` ` javascript
1188
1210
angular .module (' helloWscatsApp' ,[' ngRoute' ])
1189
1211
` ` `
@@ -1193,6 +1215,11 @@ angular.module('helloWscatsApp',['ngRoute'])
1193
1215
< div ng- view>< / div>
1194
1216
` ` `
1195
1217
1218
+ 4. 打开浏览器,定位到需要呈现路由所在的页面,我们在url基础上加` #! / 路由的名字`
1219
+ ` ` ` javascript
1220
+ url + #! / 路由的名字
1221
+ ` ` `
1222
+
1196
1223
**$routeProvider**
1197
1224
1198
1225
两个核心方法` when ()` 和` otherwise ()`
0 commit comments