angularjs 1 开发简单案例(包含common.js,service.js,controller.js,page)

Posted 2020-08-18 一米阳光

common.js

  1 var app = angular.module(\'app\', [\'ngFileUpload\'])
  2     .factory(\'SV_Common\', function ($http) {
  3         var data = {
  4             WebService: \'\',
  5         };
  6         var vm = {
  7             log: function (par, par1) {
  8                 return;
  9                 if (par1) {
 10                     console.log(\'********** common: \' + par + \' |\', par1);
 11                 } else {
 12                     console.log(\'********** common: \' + par);
 13                 }
 14             },
 15             getData: function () {
 16                 return data;
 17             },
 18             getWebService: function () {
 19                 if (!data.WebService || data.WebService == \'\') {
 20                     throw { error: \'Request setWebService\' };
 21                 }
 22                 return data.WebService;
 23             },
 24             setWebService: function (par) {
 25                 data.WebService = par;
 26                 vm.log(\'set websercie to [\' + data.WebService + \']\');
 27             },
 28             getRequest: function (func, pars) {
 29                 return {
 30                     method: \'POST\',
 31                     url: vm.getWebService() + func,
 32                     headers: {
 33                         //\'Content-Type\': \'json\',
 34                         \'Content-Type\': \'application/x-www-form-urlencoded\',
 35                     },
 36                     data: pars,
 37                     dataType: \'json\',
 38                 }
 39             },
 40             http: function (func, pars, cb) {
 41                 var re = { status: "0", context: "Internet Error" };
 42                 var req = vm.getRequest(func, pars);
 43                 vm.log(\'http \' + req.url, req.data);
 44                 $http(req).then(function (res) {
 45                     if (res.statusText == "OK") {
 46                         re = res.data;
 47                     }
 48                     if (cb) {
 49                         cb(re);
 50                     }
 51                 }, function (e) {
 52                     console.log(\'================ error:\', e);
 53                     if (cb) {
 54                         cb(re);
 55                     }
 56                 });
 57             },
 58             http_post: function (func, pars, cb) {
 59                 var re = { status: "0", context: "Internet Error" };
 60                 var req = vm.getRequest(func, pars);
 61                 vm.log(\'post \' + req.url, req.data);
 62                 
 63                 $http.post(req.url, req.data).then(function (res) {
 64                     if (res.statusText == "OK") {
 65                         re.status = "1";
 66                         re.context = res.data;
 67                     }
 68                     cb(re);
 69                 }, function (e) {
 70                     console.log(\'================ error:\', e);
 71                     if (cb) {
 72                         cb(re);
 73                     }
 74                 });
 75             },
 76             ajax_post: function (func, pars, cb) {
 77                 var re = { status: "0", context: "Internet Error" };
 78                 $.ajax({
 79                     type: "POST",
 80                     contentType: "application/json",
 81                     url: vm.getWebService() + func,
 82                     data: pars,
 83                     dataType: \'json\',
 84                     success: function (result) {
 85                         console.log(result);
 86                     },
 87                     error: function (e) {
 88                         console.log(e);
 89                     }
 90                 });
 91             },
 92             FormatDate: function (strTime) {
 93                 var date = new Date(strTime);
 94                 if (date.getFullYear() > \'2000\') {
 95                     var day = date.getDate();
 96                     var month = date.getMonth();
 97                     if (day < 10 || day < 10) {
 98                         day = \'0\' + day;
 99                     }
100                     if (month < 10 || month < 10) {
101                         month = \'0\' + (month + 1);
102                     }
103                     date = day + \'/\' + month + "/" + date.getFullYear();
104                 }
105                 else {
106                     date = null;
107                 }
108                 return date;
109             },
110             FormatDate1: function (strTime) {
111                 var date = new Date(strTime);
112                 console.log(date);
113                 if (date.getFullYear() < \'2000\') {
114                     date = \'\';
115                 }
116                 return date;
117             },
118         };
119         return vm;
120     })
121     .factory(\'SV_Popup\', function ($timeout) {
122         var data = {};
123         var vm = {
124             getSide: function (side) {
125                 var res = \'r0\';
126                 if (side) {
127                     switch (side) {
128                         case \'center\':
129                             res = \'c0\';
130                             break;
131                         case \'centerLarger\':
132                             res = \'cl0\';
133                             break;
134                         case \'right\':
135                             res = \'r0\';
136                             break;
137                         case \'rightLarge\':
138                             res = \'rl0\';
139                             break;
140                     }
141                 }
142                 return res;
143             },
144             SetPopup: function (source, side) {
145                 if (!source) {
146                     console.log(\'============== request source\');
147                     return;
148                 }
149                 //console.log(source);
150                 source.popup = {
151                     curCss: vm.getSide(side),
152                     cssList: {
153                         \'c0\': \'float_window_popup float_window_popup_init\',
154                         \'c1\': \'float_window_popup float_window_popup_show\',
155                         \'c2\': \'float_window_popup float_window_popup_hide\',
156                         \'cl0\': \'float_window_centerl float_window_centrel_init\',
157                         \'cl1\': \'float_window_centerl float_window_centrel_show\',
158                         \'cl2\': \'float_window_centerl float_window_centrel_hide\',
159 
160 
161                         \'r0\': \'float_window_right float_window_right_init\',
162                         \'r1\': \'float_window_right float_window_right_show\',
163                         \'r2\': \'float_window_right float_window_right_hide\',
164                         \'rl0\': \'float_window_right float_window_right_init\',
165                         \'rl1\': \'float_window_right float_window_rightl_show\',
166                         \'rl2\': \'float_window_right float_window_rightl_hide\',
167                     },
168                     toggle: function (sc, par) {
169                         if (sc && sc.popup) {
170                             var t = \'\';
171                             if (!par) {
172                                 switch (sc.popup.curCss) {
173                                     case \'\':
174                                     case \'c0\':
175                                         t = \'c1\';
176                                         break;
177                                     case \'c1\':
178                                         t = \'c2\';
179                                         break;
180                                     case \'c2\':
181                                         t = \'c0\';
182                                         break;
183                                     case \'cl0\':
184                                         t = \'cl1\';
185                                         break;
186                                     case \'cl1\':
187                                         t = \'cl2\';
188                                         break;
189                                     case \'cl2\':
190                                         t = \'cl0\';
191                                         break;
192 
193                                     case \'r0\':
194                                         t = \'r1\';
195                                         break;
196                                     case \'r1\':
197                                         t = \'r2\';
198                                         break;
199                                     case \'r2\':
200                                         t = \'r0\';
201                                         break;
202                                     case \'rl0\':
203                                         t = \'rl1\';
204                                         break;
205                                     case \'rl1\':
206                                         t = \'rl2\';
207                                         break;
208                                     case \'rl2\':
209                                         t = \'rl0\';
210                                         break;
211                                 }
212                             } else {
213                                 t = par;
214                             }
215                             //console.log(\'============== \' + sc.popup.curCss + \'->\' + t);
216                             if (t == \'c2\' || t == \'cl2\' || t == \'r2\' || t == \'rl2\') {
217                                 $timeout(function () {
218                                     sc.popup.toggle(sc);
219                                 }, 200);
220                             }
221                             sc.popup.curCss = t;
222                         } else {
223                             console.log(\'============== request source\');
224                         }
225                     },
226                     show: function (sc) {
227                         if (sc && sc.popup) {
228                             var tt = sc.popup.curCss;
229                             if (tt && tt.length > 0) {
230                                 tt = tt.substring(0, tt.length - 1) + \'1\';
231                                 sc.popup.toggle(sc, tt);
232                             } else {
233                                 sc.popup.toggle(sc);
234                             }
235                         } else {
236                             console.log(\'============== request source\');
237                         }
238                     },
239                     hide: function (sc) {
240                         if (sc && sc.popup) {
241                             var tt = sc.popup.curCss;
242                             if (tt && tt.length > 0) {
243                                 tt = tt.substring(0, tt.length - 1) + \'2\';
244                                 sc.popup.toggle(sc, tt);
245                             } else {
246                                 sc.popup.toggle(sc);
247                             }
248                         } else {
249                             console.log(\'============== request source\');
250                         }
251                     },
252 
253                 }
254             }
255         }
256         return vm;
257     })
258     .directive(\'bxPager\', function () {
259         return {
260             restrict: \'E\',
261             replace: true,
262             scope: {
263                 fData: \'=\',
264             },
265             template: function (el, at) {
266                 var re = "";
267                 re += \'<div class="pager">\\
268                         Total  <strong>{{fData.data.totalItems}}</strong>  items, \\
269                         <input type="text" class="pager_input" ng-model="fData.data.pageSize" ng-change="f_pager.pageSize_Change();" />\\
270                         Page Size.\\
271                         <a class="pager_button" ng-click="f_pager.curPage_AddValue(-fData.data.totalPages);" style="margin-left: 30px;">|<</a>\\
272                         <a class="pager_button" ng-click="f_pager.curPage_AddValue(-1);" ng-disabled="fData.data.curPage<=1"><</a>\\
273                         <input type="text" class="pager_input" ng-model="fData.data.curPage" ng-change="f_pager.curPage_Change();" />/{{fData.data.totalPages}} Pages&nbsp;\\
274                         <a class="pager_button" ng-click="f_pager.curPage_AddValue(1);" ng-disabled="fData.data.curPage>=fData.data.totalPages">></a>\\
275                         <a class="pager_button" ng-click="f_pager.curPage_AddValue(fData.data.totalPages);">>|</a>\\
276                     </div>\';
277                 return re;
278             },
279             controller: function ($scope, $element, $attrs, $transclude) {
280 
281                 $scope.f_pager = {
282                     pageSize_Change: function () {
283                         var i = parseInt($scope.fData.data.pageSize);
284                         if (i && i >= 0) {
285                             $scope.fData.data.pageSize = \'\' + i;
286                         } else {
287                             if ($scope.fData.data.pageSize == \'AL\') {
288                                 $scope.fData.data.pageSize = \'0\';
289                             } else {
290                                 $scope.fData.data.pageSize = \'ALL\';
291                             }
292                         }
293                         $scope.fData.data.curPage = 1;
294                         if ($scope.fData.refresh && typeof ($scope.fData.refresh) == \'function\') {
295                             $scope.fData.refresh();
296                         }
297                     },
298                     curPage_Change: function () {
299                         var i = parseInt($scope.fData.data.curPage);
300                         if (i && i > 0) {
301                             if (i > $scope.fData.data.totalPages) {
302                                 $scope.fData.data.curPage = $scope.fData.data.totalPages;
303                             } else {
304                                 $scope.fData.data.curPage = i;
305                             }
306                         } else {
307                             $scope.fData.data.curPage = 0;
308                         }
309                         if ($scope.fData.refresh && typeof ($scope.fData.refresh) == \'function\') {
310                             $scope.fData.refresh();
311                         }
312                     },
313                     curPage_AddValue: function (v) {
314                         var i = parseInt(v);
315                         //console.log($scope.fData.data.curPage,i);
316                         if (i) {
317                             var temp = $scope.fData.data.curPage + i;
318                             if (temp < 1) {
319                                 temp = 1;
320                             }
321                             if (temp > $scope.fData.data.totalPages) {
322                                 temp = $scope.fData.data.totalPages;
323                             }
324                             if (temp != $scope.fData.data.curPage) {
325                                 $scope.fData.data.curPage = temp;
326                                 //SV_List.refresh(null, function (res) { });
327                                 //console.log($scope.fRefresh);
328                                 if ($scope.fData.refresh && typeof ($scope.fData.refresh) == \'function\') {
329                                     $scope.fData.refresh();
330                                 }
331                             }
332                         }
333                     }
334                 }
335             }
336         }
337     });

View Code

service.js

 1 app.factory(\'SV_AssignExport\', function ($http, SV_Common) {
 2     var data = {
 3         pager: {
 4             totalItems: 0,
 5             totalPages: 10,
 6             curPage: 0,
 7             pageSize: \'100\',
 8         },
 9         search: {},
10         client: {
11             title: \'客户/Client\',
12             list:[]
13         },
14         list: [],
15         refnos: {},
16         row: {},
17         show:false,
18     }
19     var vm = {
20         init: function () {
21             SV_Common.setWebService(\'JobService.asmx\');
22             data.search = {
23                 From: new Date(),
24                 To: new Date(),
25                 DateBy: \'Job\',
26                 Type: \'WGR\',
27                 JobNo: \'\',
28                 BookingNo: \'\',
29                 HblNo: \'\',
30                 Vessel: \'\',
31                 Product: \'\',
32                 Client: \'\',
33                 ClientName: \'\',
34             };
35             vm.refresh_client();
36         },
37         GetData: function () {
38             return data;
39         },
40         refresh: function (pars, cb) {
41             var pars = angular.copy(data.search);
42             pars.From = moment(pars.From).format(\'YYYYMMDD\');
43             pars.To = moment(pars.To).add(1, \'days\').format(\'YYYYMMDD\');
44             pars.curPage = data.pager.curPage;
45             pars.pageSize = data.pager.pageSize;
46             console.log(pars);
47             var func = "/List_AssignCargo_GetData";
48             SV_Common.http(func, pars, function (res) {
49                 if (res.status == true) {
50                     data.pager.curPage = res.context.curPage;
51                     data.pager.totalPages = res.context.totalPages;
52                     data.pager.totalItems = res.context.totalItems;
53                     var temp = res.context.list;
54                     data.list = res.context.list;
55                 }
56                 if (cb) {
57                     cb(res);
58                 }
59             })
60         },
61         save: function (par, cb) {
62             var pars = angular.copy(par);
63             var func = "/Save_AssignExport_Data";
64             SV_Common.http(func, pars, function (res) {
65                 以上是关于angularjs 1 开发简单案例(包含common.js,service.js,controller.js,page)的主要内容，如果未能解决你的问题，请参考以下文章
 
 AngularJs最简单解决跨域问题案例
 AngularJS中的transclusion案例
 AngularJs最简单解决跨域问题案例
 无法从 Angularjs 组件访问 Popover 模板上的变量
 Unity开发OpenXR | 使用 OpenXR 制作一款简单VR示例场景 的全过程详细教程，包含两个实战案例。
 Unity开发OpenXR | 使用 OpenXR 制作一款简单VR示例场景 的全过程详细教程，包含两个实战案例。