angularjs-rails-resource 2.2.2 → 2.3.0

Sign up to get free protection for your applications and to get access to all the features.
@@ -1,911 +0,0 @@
1
- /**
2
- * @license AngularJS v1.2.6
3
- * (c) 2010-2014 Google, Inc. http://angularjs.org
4
- * License: MIT
5
- */
6
- (function(window, angular, undefined) {'use strict';
7
-
8
- /**
9
- * @ngdoc overview
10
- * @name ngRoute
11
- * @description
12
- *
13
- * # ngRoute
14
- *
15
- * The `ngRoute` module provides routing and deeplinking services and directives for angular apps.
16
- *
17
- * ## Example
18
- * See {@link ngRoute.$route#example $route} for an example of configuring and using `ngRoute`.
19
- *
20
- * {@installModule route}
21
- *
22
- * <div doc-module-components="ngRoute"></div>
23
- */
24
- /* global -ngRouteModule */
25
- var ngRouteModule = angular.module('ngRoute', ['ng']).
26
- provider('$route', $RouteProvider);
27
-
28
- /**
29
- * @ngdoc object
30
- * @name ngRoute.$routeProvider
31
- * @function
32
- *
33
- * @description
34
- *
35
- * Used for configuring routes.
36
- *
37
- * ## Example
38
- * See {@link ngRoute.$route#example $route} for an example of configuring and using `ngRoute`.
39
- *
40
- * ## Dependencies
41
- * Requires the {@link ngRoute `ngRoute`} module to be installed.
42
- */
43
- function $RouteProvider(){
44
- function inherit(parent, extra) {
45
- return angular.extend(new (angular.extend(function() {}, {prototype:parent}))(), extra);
46
- }
47
-
48
- var routes = {};
49
-
50
- /**
51
- * @ngdoc method
52
- * @name ngRoute.$routeProvider#when
53
- * @methodOf ngRoute.$routeProvider
54
- *
55
- * @param {string} path Route path (matched against `$location.path`). If `$location.path`
56
- * contains redundant trailing slash or is missing one, the route will still match and the
57
- * `$location.path` will be updated to add or drop the trailing slash to exactly match the
58
- * route definition.
59
- *
60
- * * `path` can contain named groups starting with a colon: e.g. `:name`. All characters up
61
- * to the next slash are matched and stored in `$routeParams` under the given `name`
62
- * when the route matches.
63
- * * `path` can contain named groups starting with a colon and ending with a star:
64
- * e.g.`:name*`. All characters are eagerly stored in `$routeParams` under the given `name`
65
- * when the route matches.
66
- * * `path` can contain optional named groups with a question mark: e.g.`:name?`.
67
- *
68
- * For example, routes like `/color/:color/largecode/:largecode*\/edit` will match
69
- * `/color/brown/largecode/code/with/slashs/edit` and extract:
70
- *
71
- * * `color: brown`
72
- * * `largecode: code/with/slashs`.
73
- *
74
- *
75
- * @param {Object} route Mapping information to be assigned to `$route.current` on route
76
- * match.
77
- *
78
- * Object properties:
79
- *
80
- * - `controller` – `{(string|function()=}` – Controller fn that should be associated with
81
- * newly created scope or the name of a {@link angular.Module#controller registered
82
- * controller} if passed as a string.
83
- * - `controllerAs` – `{string=}` – A controller alias name. If present the controller will be
84
- * published to scope under the `controllerAs` name.
85
- * - `template` – `{string=|function()=}` – html template as a string or a function that
86
- * returns an html template as a string which should be used by {@link
87
- * ngRoute.directive:ngView ngView} or {@link ng.directive:ngInclude ngInclude} directives.
88
- * This property takes precedence over `templateUrl`.
89
- *
90
- * If `template` is a function, it will be called with the following parameters:
91
- *
92
- * - `{Array.<Object>}` - route parameters extracted from the current
93
- * `$location.path()` by applying the current route
94
- *
95
- * - `templateUrl` – `{string=|function()=}` – path or function that returns a path to an html
96
- * template that should be used by {@link ngRoute.directive:ngView ngView}.
97
- *
98
- * If `templateUrl` is a function, it will be called with the following parameters:
99
- *
100
- * - `{Array.<Object>}` - route parameters extracted from the current
101
- * `$location.path()` by applying the current route
102
- *
103
- * - `resolve` - `{Object.<string, function>=}` - An optional map of dependencies which should
104
- * be injected into the controller. If any of these dependencies are promises, the router
105
- * will wait for them all to be resolved or one to be rejected before the controller is
106
- * instantiated.
107
- * If all the promises are resolved successfully, the values of the resolved promises are
108
- * injected and {@link ngRoute.$route#$routeChangeSuccess $routeChangeSuccess} event is
109
- * fired. If any of the promises are rejected the
110
- * {@link ngRoute.$route#$routeChangeError $routeChangeError} event is fired. The map object
111
- * is:
112
- *
113
- * - `key` – `{string}`: a name of a dependency to be injected into the controller.
114
- * - `factory` - `{string|function}`: If `string` then it is an alias for a service.
115
- * Otherwise if function, then it is {@link api/AUTO.$injector#invoke injected}
116
- * and the return value is treated as the dependency. If the result is a promise, it is
117
- * resolved before its value is injected into the controller. Be aware that
118
- * `ngRoute.$routeParams` will still refer to the previous route within these resolve
119
- * functions. Use `$route.current.params` to access the new route parameters, instead.
120
- *
121
- * - `redirectTo` – {(string|function())=} – value to update
122
- * {@link ng.$location $location} path with and trigger route redirection.
123
- *
124
- * If `redirectTo` is a function, it will be called with the following parameters:
125
- *
126
- * - `{Object.<string>}` - route parameters extracted from the current
127
- * `$location.path()` by applying the current route templateUrl.
128
- * - `{string}` - current `$location.path()`
129
- * - `{Object}` - current `$location.search()`
130
- *
131
- * The custom `redirectTo` function is expected to return a string which will be used
132
- * to update `$location.path()` and `$location.search()`.
133
- *
134
- * - `[reloadOnSearch=true]` - {boolean=} - reload route when only `$location.search()`
135
- * or `$location.hash()` changes.
136
- *
137
- * If the option is set to `false` and url in the browser changes, then
138
- * `$routeUpdate` event is broadcasted on the root scope.
139
- *
140
- * - `[caseInsensitiveMatch=false]` - {boolean=} - match routes without being case sensitive
141
- *
142
- * If the option is set to `true`, then the particular route can be matched without being
143
- * case sensitive
144
- *
145
- * @returns {Object} self
146
- *
147
- * @description
148
- * Adds a new route definition to the `$route` service.
149
- */
150
- this.when = function(path, route) {
151
- routes[path] = angular.extend(
152
- {reloadOnSearch: true},
153
- route,
154
- path && pathRegExp(path, route)
155
- );
156
-
157
- // create redirection for trailing slashes
158
- if (path) {
159
- var redirectPath = (path[path.length-1] == '/')
160
- ? path.substr(0, path.length-1)
161
- : path +'/';
162
-
163
- routes[redirectPath] = angular.extend(
164
- {redirectTo: path},
165
- pathRegExp(redirectPath, route)
166
- );
167
- }
168
-
169
- return this;
170
- };
171
-
172
- /**
173
- * @param path {string} path
174
- * @param opts {Object} options
175
- * @return {?Object}
176
- *
177
- * @description
178
- * Normalizes the given path, returning a regular expression
179
- * and the original path.
180
- *
181
- * Inspired by pathRexp in visionmedia/express/lib/utils.js.
182
- */
183
- function pathRegExp(path, opts) {
184
- var insensitive = opts.caseInsensitiveMatch,
185
- ret = {
186
- originalPath: path,
187
- regexp: path
188
- },
189
- keys = ret.keys = [];
190
-
191
- path = path
192
- .replace(/([().])/g, '\\$1')
193
- .replace(/(\/)?:(\w+)([\?|\*])?/g, function(_, slash, key, option){
194
- var optional = option === '?' ? option : null;
195
- var star = option === '*' ? option : null;
196
- keys.push({ name: key, optional: !!optional });
197
- slash = slash || '';
198
- return ''
199
- + (optional ? '' : slash)
200
- + '(?:'
201
- + (optional ? slash : '')
202
- + (star && '(.+?)' || '([^/]+)')
203
- + (optional || '')
204
- + ')'
205
- + (optional || '');
206
- })
207
- .replace(/([\/$\*])/g, '\\$1');
208
-
209
- ret.regexp = new RegExp('^' + path + '$', insensitive ? 'i' : '');
210
- return ret;
211
- }
212
-
213
- /**
214
- * @ngdoc method
215
- * @name ngRoute.$routeProvider#otherwise
216
- * @methodOf ngRoute.$routeProvider
217
- *
218
- * @description
219
- * Sets route definition that will be used on route change when no other route definition
220
- * is matched.
221
- *
222
- * @param {Object} params Mapping information to be assigned to `$route.current`.
223
- * @returns {Object} self
224
- */
225
- this.otherwise = function(params) {
226
- this.when(null, params);
227
- return this;
228
- };
229
-
230
-
231
- this.$get = ['$rootScope',
232
- '$location',
233
- '$routeParams',
234
- '$q',
235
- '$injector',
236
- '$http',
237
- '$templateCache',
238
- '$sce',
239
- function($rootScope, $location, $routeParams, $q, $injector, $http, $templateCache, $sce) {
240
-
241
- /**
242
- * @ngdoc object
243
- * @name ngRoute.$route
244
- * @requires $location
245
- * @requires $routeParams
246
- *
247
- * @property {Object} current Reference to the current route definition.
248
- * The route definition contains:
249
- *
250
- * - `controller`: The controller constructor as define in route definition.
251
- * - `locals`: A map of locals which is used by {@link ng.$controller $controller} service for
252
- * controller instantiation. The `locals` contain
253
- * the resolved values of the `resolve` map. Additionally the `locals` also contain:
254
- *
255
- * - `$scope` - The current route scope.
256
- * - `$template` - The current route template HTML.
257
- *
258
- * @property {Array.<Object>} routes Array of all configured routes.
259
- *
260
- * @description
261
- * `$route` is used for deep-linking URLs to controllers and views (HTML partials).
262
- * It watches `$location.url()` and tries to map the path to an existing route definition.
263
- *
264
- * Requires the {@link ngRoute `ngRoute`} module to be installed.
265
- *
266
- * You can define routes through {@link ngRoute.$routeProvider $routeProvider}'s API.
267
- *
268
- * The `$route` service is typically used in conjunction with the
269
- * {@link ngRoute.directive:ngView `ngView`} directive and the
270
- * {@link ngRoute.$routeParams `$routeParams`} service.
271
- *
272
- * @example
273
- This example shows how changing the URL hash causes the `$route` to match a route against the
274
- URL, and the `ngView` pulls in the partial.
275
-
276
- Note that this example is using {@link ng.directive:script inlined templates}
277
- to get it working on jsfiddle as well.
278
-
279
- <example module="ngViewExample" deps="angular-route.js">
280
- <file name="index.html">
281
- <div ng-controller="MainCntl">
282
- Choose:
283
- <a href="Book/Moby">Moby</a> |
284
- <a href="Book/Moby/ch/1">Moby: Ch1</a> |
285
- <a href="Book/Gatsby">Gatsby</a> |
286
- <a href="Book/Gatsby/ch/4?key=value">Gatsby: Ch4</a> |
287
- <a href="Book/Scarlet">Scarlet Letter</a><br/>
288
-
289
- <div ng-view></div>
290
- <hr />
291
-
292
- <pre>$location.path() = {{$location.path()}}</pre>
293
- <pre>$route.current.templateUrl = {{$route.current.templateUrl}}</pre>
294
- <pre>$route.current.params = {{$route.current.params}}</pre>
295
- <pre>$route.current.scope.name = {{$route.current.scope.name}}</pre>
296
- <pre>$routeParams = {{$routeParams}}</pre>
297
- </div>
298
- </file>
299
-
300
- <file name="book.html">
301
- controller: {{name}}<br />
302
- Book Id: {{params.bookId}}<br />
303
- </file>
304
-
305
- <file name="chapter.html">
306
- controller: {{name}}<br />
307
- Book Id: {{params.bookId}}<br />
308
- Chapter Id: {{params.chapterId}}
309
- </file>
310
-
311
- <file name="script.js">
312
- angular.module('ngViewExample', ['ngRoute'])
313
-
314
- .config(function($routeProvider, $locationProvider) {
315
- $routeProvider.when('/Book/:bookId', {
316
- templateUrl: 'book.html',
317
- controller: BookCntl,
318
- resolve: {
319
- // I will cause a 1 second delay
320
- delay: function($q, $timeout) {
321
- var delay = $q.defer();
322
- $timeout(delay.resolve, 1000);
323
- return delay.promise;
324
- }
325
- }
326
- });
327
- $routeProvider.when('/Book/:bookId/ch/:chapterId', {
328
- templateUrl: 'chapter.html',
329
- controller: ChapterCntl
330
- });
331
-
332
- // configure html5 to get links working on jsfiddle
333
- $locationProvider.html5Mode(true);
334
- });
335
-
336
- function MainCntl($scope, $route, $routeParams, $location) {
337
- $scope.$route = $route;
338
- $scope.$location = $location;
339
- $scope.$routeParams = $routeParams;
340
- }
341
-
342
- function BookCntl($scope, $routeParams) {
343
- $scope.name = "BookCntl";
344
- $scope.params = $routeParams;
345
- }
346
-
347
- function ChapterCntl($scope, $routeParams) {
348
- $scope.name = "ChapterCntl";
349
- $scope.params = $routeParams;
350
- }
351
- </file>
352
-
353
- <file name="scenario.js">
354
- it('should load and compile correct template', function() {
355
- element('a:contains("Moby: Ch1")').click();
356
- var content = element('.doc-example-live [ng-view]').text();
357
- expect(content).toMatch(/controller\: ChapterCntl/);
358
- expect(content).toMatch(/Book Id\: Moby/);
359
- expect(content).toMatch(/Chapter Id\: 1/);
360
-
361
- element('a:contains("Scarlet")').click();
362
- sleep(2); // promises are not part of scenario waiting
363
- content = element('.doc-example-live [ng-view]').text();
364
- expect(content).toMatch(/controller\: BookCntl/);
365
- expect(content).toMatch(/Book Id\: Scarlet/);
366
- });
367
- </file>
368
- </example>
369
- */
370
-
371
- /**
372
- * @ngdoc event
373
- * @name ngRoute.$route#$routeChangeStart
374
- * @eventOf ngRoute.$route
375
- * @eventType broadcast on root scope
376
- * @description
377
- * Broadcasted before a route change. At this point the route services starts
378
- * resolving all of the dependencies needed for the route change to occurs.
379
- * Typically this involves fetching the view template as well as any dependencies
380
- * defined in `resolve` route property. Once all of the dependencies are resolved
381
- * `$routeChangeSuccess` is fired.
382
- *
383
- * @param {Object} angularEvent Synthetic event object.
384
- * @param {Route} next Future route information.
385
- * @param {Route} current Current route information.
386
- */
387
-
388
- /**
389
- * @ngdoc event
390
- * @name ngRoute.$route#$routeChangeSuccess
391
- * @eventOf ngRoute.$route
392
- * @eventType broadcast on root scope
393
- * @description
394
- * Broadcasted after a route dependencies are resolved.
395
- * {@link ngRoute.directive:ngView ngView} listens for the directive
396
- * to instantiate the controller and render the view.
397
- *
398
- * @param {Object} angularEvent Synthetic event object.
399
- * @param {Route} current Current route information.
400
- * @param {Route|Undefined} previous Previous route information, or undefined if current is
401
- * first route entered.
402
- */
403
-
404
- /**
405
- * @ngdoc event
406
- * @name ngRoute.$route#$routeChangeError
407
- * @eventOf ngRoute.$route
408
- * @eventType broadcast on root scope
409
- * @description
410
- * Broadcasted if any of the resolve promises are rejected.
411
- *
412
- * @param {Object} angularEvent Synthetic event object
413
- * @param {Route} current Current route information.
414
- * @param {Route} previous Previous route information.
415
- * @param {Route} rejection Rejection of the promise. Usually the error of the failed promise.
416
- */
417
-
418
- /**
419
- * @ngdoc event
420
- * @name ngRoute.$route#$routeUpdate
421
- * @eventOf ngRoute.$route
422
- * @eventType broadcast on root scope
423
- * @description
424
- *
425
- * The `reloadOnSearch` property has been set to false, and we are reusing the same
426
- * instance of the Controller.
427
- */
428
-
429
- var forceReload = false,
430
- $route = {
431
- routes: routes,
432
-
433
- /**
434
- * @ngdoc method
435
- * @name ngRoute.$route#reload
436
- * @methodOf ngRoute.$route
437
- *
438
- * @description
439
- * Causes `$route` service to reload the current route even if
440
- * {@link ng.$location $location} hasn't changed.
441
- *
442
- * As a result of that, {@link ngRoute.directive:ngView ngView}
443
- * creates new scope, reinstantiates the controller.
444
- */
445
- reload: function() {
446
- forceReload = true;
447
- $rootScope.$evalAsync(updateRoute);
448
- }
449
- };
450
-
451
- $rootScope.$on('$locationChangeSuccess', updateRoute);
452
-
453
- return $route;
454
-
455
- /////////////////////////////////////////////////////
456
-
457
- /**
458
- * @param on {string} current url
459
- * @param route {Object} route regexp to match the url against
460
- * @return {?Object}
461
- *
462
- * @description
463
- * Check if the route matches the current url.
464
- *
465
- * Inspired by match in
466
- * visionmedia/express/lib/router/router.js.
467
- */
468
- function switchRouteMatcher(on, route) {
469
- var keys = route.keys,
470
- params = {};
471
-
472
- if (!route.regexp) return null;
473
-
474
- var m = route.regexp.exec(on);
475
- if (!m) return null;
476
-
477
- for (var i = 1, len = m.length; i < len; ++i) {
478
- var key = keys[i - 1];
479
-
480
- var val = 'string' == typeof m[i]
481
- ? decodeURIComponent(m[i])
482
- : m[i];
483
-
484
- if (key && val) {
485
- params[key.name] = val;
486
- }
487
- }
488
- return params;
489
- }
490
-
491
- function updateRoute() {
492
- var next = parseRoute(),
493
- last = $route.current;
494
-
495
- if (next && last && next.$$route === last.$$route
496
- && angular.equals(next.pathParams, last.pathParams)
497
- && !next.reloadOnSearch && !forceReload) {
498
- last.params = next.params;
499
- angular.copy(last.params, $routeParams);
500
- $rootScope.$broadcast('$routeUpdate', last);
501
- } else if (next || last) {
502
- forceReload = false;
503
- $rootScope.$broadcast('$routeChangeStart', next, last);
504
- $route.current = next;
505
- if (next) {
506
- if (next.redirectTo) {
507
- if (angular.isString(next.redirectTo)) {
508
- $location.path(interpolate(next.redirectTo, next.params)).search(next.params)
509
- .replace();
510
- } else {
511
- $location.url(next.redirectTo(next.pathParams, $location.path(), $location.search()))
512
- .replace();
513
- }
514
- }
515
- }
516
-
517
- $q.when(next).
518
- then(function() {
519
- if (next) {
520
- var locals = angular.extend({}, next.resolve),
521
- template, templateUrl;
522
-
523
- angular.forEach(locals, function(value, key) {
524
- locals[key] = angular.isString(value) ?
525
- $injector.get(value) : $injector.invoke(value);
526
- });
527
-
528
- if (angular.isDefined(template = next.template)) {
529
- if (angular.isFunction(template)) {
530
- template = template(next.params);
531
- }
532
- } else if (angular.isDefined(templateUrl = next.templateUrl)) {
533
- if (angular.isFunction(templateUrl)) {
534
- templateUrl = templateUrl(next.params);
535
- }
536
- templateUrl = $sce.getTrustedResourceUrl(templateUrl);
537
- if (angular.isDefined(templateUrl)) {
538
- next.loadedTemplateUrl = templateUrl;
539
- template = $http.get(templateUrl, {cache: $templateCache}).
540
- then(function(response) { return response.data; });
541
- }
542
- }
543
- if (angular.isDefined(template)) {
544
- locals['$template'] = template;
545
- }
546
- return $q.all(locals);
547
- }
548
- }).
549
- // after route change
550
- then(function(locals) {
551
- if (next == $route.current) {
552
- if (next) {
553
- next.locals = locals;
554
- angular.copy(next.params, $routeParams);
555
- }
556
- $rootScope.$broadcast('$routeChangeSuccess', next, last);
557
- }
558
- }, function(error) {
559
- if (next == $route.current) {
560
- $rootScope.$broadcast('$routeChangeError', next, last, error);
561
- }
562
- });
563
- }
564
- }
565
-
566
-
567
- /**
568
- * @returns the current active route, by matching it against the URL
569
- */
570
- function parseRoute() {
571
- // Match a route
572
- var params, match;
573
- angular.forEach(routes, function(route, path) {
574
- if (!match && (params = switchRouteMatcher($location.path(), route))) {
575
- match = inherit(route, {
576
- params: angular.extend({}, $location.search(), params),
577
- pathParams: params});
578
- match.$$route = route;
579
- }
580
- });
581
- // No route matched; fallback to "otherwise" route
582
- return match || routes[null] && inherit(routes[null], {params: {}, pathParams:{}});
583
- }
584
-
585
- /**
586
- * @returns interpolation of the redirect path with the parameters
587
- */
588
- function interpolate(string, params) {
589
- var result = [];
590
- angular.forEach((string||'').split(':'), function(segment, i) {
591
- if (i === 0) {
592
- result.push(segment);
593
- } else {
594
- var segmentMatch = segment.match(/(\w+)(.*)/);
595
- var key = segmentMatch[1];
596
- result.push(params[key]);
597
- result.push(segmentMatch[2] || '');
598
- delete params[key];
599
- }
600
- });
601
- return result.join('');
602
- }
603
- }];
604
- }
605
-
606
- ngRouteModule.provider('$routeParams', $RouteParamsProvider);
607
-
608
-
609
- /**
610
- * @ngdoc object
611
- * @name ngRoute.$routeParams
612
- * @requires $route
613
- *
614
- * @description
615
- * The `$routeParams` service allows you to retrieve the current set of route parameters.
616
- *
617
- * Requires the {@link ngRoute `ngRoute`} module to be installed.
618
- *
619
- * The route parameters are a combination of {@link ng.$location `$location`}'s
620
- * {@link ng.$location#methods_search `search()`} and {@link ng.$location#methods_path `path()`}.
621
- * The `path` parameters are extracted when the {@link ngRoute.$route `$route`} path is matched.
622
- *
623
- * In case of parameter name collision, `path` params take precedence over `search` params.
624
- *
625
- * The service guarantees that the identity of the `$routeParams` object will remain unchanged
626
- * (but its properties will likely change) even when a route change occurs.
627
- *
628
- * Note that the `$routeParams` are only updated *after* a route change completes successfully.
629
- * This means that you cannot rely on `$routeParams` being correct in route resolve functions.
630
- * Instead you can use `$route.current.params` to access the new route's parameters.
631
- *
632
- * @example
633
- * <pre>
634
- * // Given:
635
- * // URL: http://server.com/index.html#/Chapter/1/Section/2?search=moby
636
- * // Route: /Chapter/:chapterId/Section/:sectionId
637
- * //
638
- * // Then
639
- * $routeParams ==> {chapterId:1, sectionId:2, search:'moby'}
640
- * </pre>
641
- */
642
- function $RouteParamsProvider() {
643
- this.$get = function() { return {}; };
644
- }
645
-
646
- ngRouteModule.directive('ngView', ngViewFactory);
647
- ngRouteModule.directive('ngView', ngViewFillContentFactory);
648
-
649
-
650
- /**
651
- * @ngdoc directive
652
- * @name ngRoute.directive:ngView
653
- * @restrict ECA
654
- *
655
- * @description
656
- * # Overview
657
- * `ngView` is a directive that complements the {@link ngRoute.$route $route} service by
658
- * including the rendered template of the current route into the main layout (`index.html`) file.
659
- * Every time the current route changes, the included view changes with it according to the
660
- * configuration of the `$route` service.
661
- *
662
- * Requires the {@link ngRoute `ngRoute`} module to be installed.
663
- *
664
- * @animations
665
- * enter - animation is used to bring new content into the browser.
666
- * leave - animation is used to animate existing content away.
667
- *
668
- * The enter and leave animation occur concurrently.
669
- *
670
- * @scope
671
- * @priority 400
672
- * @example
673
- <example module="ngViewExample" deps="angular-route.js" animations="true">
674
- <file name="index.html">
675
- <div ng-controller="MainCntl as main">
676
- Choose:
677
- <a href="Book/Moby">Moby</a> |
678
- <a href="Book/Moby/ch/1">Moby: Ch1</a> |
679
- <a href="Book/Gatsby">Gatsby</a> |
680
- <a href="Book/Gatsby/ch/4?key=value">Gatsby: Ch4</a> |
681
- <a href="Book/Scarlet">Scarlet Letter</a><br/>
682
-
683
- <div class="view-animate-container">
684
- <div ng-view class="view-animate"></div>
685
- </div>
686
- <hr />
687
-
688
- <pre>$location.path() = {{main.$location.path()}}</pre>
689
- <pre>$route.current.templateUrl = {{main.$route.current.templateUrl}}</pre>
690
- <pre>$route.current.params = {{main.$route.current.params}}</pre>
691
- <pre>$route.current.scope.name = {{main.$route.current.scope.name}}</pre>
692
- <pre>$routeParams = {{main.$routeParams}}</pre>
693
- </div>
694
- </file>
695
-
696
- <file name="book.html">
697
- <div>
698
- controller: {{book.name}}<br />
699
- Book Id: {{book.params.bookId}}<br />
700
- </div>
701
- </file>
702
-
703
- <file name="chapter.html">
704
- <div>
705
- controller: {{chapter.name}}<br />
706
- Book Id: {{chapter.params.bookId}}<br />
707
- Chapter Id: {{chapter.params.chapterId}}
708
- </div>
709
- </file>
710
-
711
- <file name="animations.css">
712
- .view-animate-container {
713
- position:relative;
714
- height:100px!important;
715
- position:relative;
716
- background:white;
717
- border:1px solid black;
718
- height:40px;
719
- overflow:hidden;
720
- }
721
-
722
- .view-animate {
723
- padding:10px;
724
- }
725
-
726
- .view-animate.ng-enter, .view-animate.ng-leave {
727
- -webkit-transition:all cubic-bezier(0.250, 0.460, 0.450, 0.940) 1.5s;
728
- transition:all cubic-bezier(0.250, 0.460, 0.450, 0.940) 1.5s;
729
-
730
- display:block;
731
- width:100%;
732
- border-left:1px solid black;
733
-
734
- position:absolute;
735
- top:0;
736
- left:0;
737
- right:0;
738
- bottom:0;
739
- padding:10px;
740
- }
741
-
742
- .view-animate.ng-enter {
743
- left:100%;
744
- }
745
- .view-animate.ng-enter.ng-enter-active {
746
- left:0;
747
- }
748
- .view-animate.ng-leave.ng-leave-active {
749
- left:-100%;
750
- }
751
- </file>
752
-
753
- <file name="script.js">
754
- angular.module('ngViewExample', ['ngRoute', 'ngAnimate'],
755
- function($routeProvider, $locationProvider) {
756
- $routeProvider.when('/Book/:bookId', {
757
- templateUrl: 'book.html',
758
- controller: BookCntl,
759
- controllerAs: 'book'
760
- });
761
- $routeProvider.when('/Book/:bookId/ch/:chapterId', {
762
- templateUrl: 'chapter.html',
763
- controller: ChapterCntl,
764
- controllerAs: 'chapter'
765
- });
766
-
767
- // configure html5 to get links working on jsfiddle
768
- $locationProvider.html5Mode(true);
769
- });
770
-
771
- function MainCntl($route, $routeParams, $location) {
772
- this.$route = $route;
773
- this.$location = $location;
774
- this.$routeParams = $routeParams;
775
- }
776
-
777
- function BookCntl($routeParams) {
778
- this.name = "BookCntl";
779
- this.params = $routeParams;
780
- }
781
-
782
- function ChapterCntl($routeParams) {
783
- this.name = "ChapterCntl";
784
- this.params = $routeParams;
785
- }
786
- </file>
787
-
788
- <file name="scenario.js">
789
- it('should load and compile correct template', function() {
790
- element('a:contains("Moby: Ch1")').click();
791
- var content = element('.doc-example-live [ng-view]').text();
792
- expect(content).toMatch(/controller\: ChapterCntl/);
793
- expect(content).toMatch(/Book Id\: Moby/);
794
- expect(content).toMatch(/Chapter Id\: 1/);
795
-
796
- element('a:contains("Scarlet")').click();
797
- content = element('.doc-example-live [ng-view]').text();
798
- expect(content).toMatch(/controller\: BookCntl/);
799
- expect(content).toMatch(/Book Id\: Scarlet/);
800
- });
801
- </file>
802
- </example>
803
- */
804
-
805
-
806
- /**
807
- * @ngdoc event
808
- * @name ngRoute.directive:ngView#$viewContentLoaded
809
- * @eventOf ngRoute.directive:ngView
810
- * @eventType emit on the current ngView scope
811
- * @description
812
- * Emitted every time the ngView content is reloaded.
813
- */
814
- ngViewFactory.$inject = ['$route', '$anchorScroll', '$animate'];
815
- function ngViewFactory( $route, $anchorScroll, $animate) {
816
- return {
817
- restrict: 'ECA',
818
- terminal: true,
819
- priority: 400,
820
- transclude: 'element',
821
- link: function(scope, $element, attr, ctrl, $transclude) {
822
- var currentScope,
823
- currentElement,
824
- autoScrollExp = attr.autoscroll,
825
- onloadExp = attr.onload || '';
826
-
827
- scope.$on('$routeChangeSuccess', update);
828
- update();
829
-
830
- function cleanupLastView() {
831
- if (currentScope) {
832
- currentScope.$destroy();
833
- currentScope = null;
834
- }
835
- if(currentElement) {
836
- $animate.leave(currentElement);
837
- currentElement = null;
838
- }
839
- }
840
-
841
- function update() {
842
- var locals = $route.current && $route.current.locals,
843
- template = locals && locals.$template;
844
-
845
- if (template) {
846
- var newScope = scope.$new();
847
- var current = $route.current;
848
-
849
- // Note: This will also link all children of ng-view that were contained in the original
850
- // html. If that content contains controllers, ... they could pollute/change the scope.
851
- // However, using ng-view on an element with additional content does not make sense...
852
- // Note: We can't remove them in the cloneAttchFn of $transclude as that
853
- // function is called before linking the content, which would apply child
854
- // directives to non existing elements.
855
- var clone = $transclude(newScope, function(clone) {
856
- $animate.enter(clone, null, currentElement || $element, function onNgViewEnter () {
857
- if (angular.isDefined(autoScrollExp)
858
- && (!autoScrollExp || scope.$eval(autoScrollExp))) {
859
- $anchorScroll();
860
- }
861
- });
862
- cleanupLastView();
863
- });
864
-
865
- currentElement = clone;
866
- currentScope = current.scope = newScope;
867
- currentScope.$emit('$viewContentLoaded');
868
- currentScope.$eval(onloadExp);
869
- } else {
870
- cleanupLastView();
871
- }
872
- }
873
- }
874
- };
875
- }
876
-
877
- // This directive is called during the $transclude call of the first `ngView` directive.
878
- // It will replace and compile the content of the element with the loaded template.
879
- // We need this directive so that the element content is already filled when
880
- // the link function of another directive on the same element as ngView
881
- // is called.
882
- ngViewFillContentFactory.$inject = ['$compile', '$controller', '$route'];
883
- function ngViewFillContentFactory($compile, $controller, $route) {
884
- return {
885
- restrict: 'ECA',
886
- priority: -400,
887
- link: function(scope, $element) {
888
- var current = $route.current,
889
- locals = current.locals;
890
-
891
- $element.html(locals.$template);
892
-
893
- var link = $compile($element.contents());
894
-
895
- if (current.controller) {
896
- locals.$scope = scope;
897
- var controller = $controller(current.controller, locals);
898
- if (current.controllerAs) {
899
- scope[current.controllerAs] = controller;
900
- }
901
- $element.data('$ngControllerController', controller);
902
- $element.children().data('$ngControllerController', controller);
903
- }
904
-
905
- link(scope);
906
- }
907
- };
908
- }
909
-
910
-
911
- })(window, window.angular);