@angular-wave/angular.ts 0.0.20 → 0.0.22
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/Makefile +1 -1
- package/README.md +3 -3
- package/TODO.md +14 -0
- package/dist/angular-ts.esm.js +1 -1
- package/dist/angular-ts.umd.js +1 -1
- package/index.html +2 -1
- package/package.json +1 -1
- package/src/animations/animate-css-driver.js +2 -2
- package/src/animations/animate-css.js +15 -6
- package/src/animations/animate-js.js +1 -1
- package/src/animations/animate-queue.js +1 -1
- package/src/animations/shared.js +0 -14
- package/src/core/compile.js +6 -3
- package/src/core/q.js +9 -9
- package/src/core/sanitize-uri.js +1 -1
- package/src/core/sce.js +1 -1
- package/src/directive/if.js +0 -79
- package/src/directive/if.md +80 -0
- package/src/directive/include.js +0 -82
- package/src/directive/include.md +86 -0
- package/src/directive/repeat.js +0 -1
- package/src/loader.js +0 -1
- package/src/public.js +0 -2
- package/src/router/common/trace.js +1 -1
- package/src/router/directives/stateDirectives.js +16 -14
- package/src/router/directives/viewDirective.js +2 -2
- package/src/router/hooks/resolve.js +3 -4
- package/src/router/hooks/views.js +3 -2
- package/src/router/state/stateService.js +1 -2
- package/src/router/transition/interface.js +14 -14
- package/src/router/transition/rejectFactory.js +29 -20
- package/src/router/transition/transitionHook.js +5 -5
- package/src/router/url/urlMatcher.js +1 -2
- package/src/router/url/urlRule.js +1 -1
- package/src/router/url/urlRules.js +1 -1
- package/src/shared/common.js +0 -1
- package/test/module-test.html +44 -12
- package/test/router/services.spec.js +71 -0
- package/test/router/state-directives.spec.js +1208 -0
- package/types/angular.d.ts +132 -124
- package/types/index.d.ts +2350 -2187
- package/types/jqlite.d.ts +463 -418
- package/types/router/core/common/common.d.ts +70 -24
- package/types/router/core/common/coreservices.d.ts +30 -32
- package/types/router/core/common/glob.d.ts +9 -9
- package/types/router/core/common/hof.d.ts +12 -4
- package/types/router/core/common/index.d.ts +8 -8
- package/types/router/core/common/predicates.d.ts +1 -1
- package/types/router/core/common/queue.d.ts +13 -13
- package/types/router/core/common/safeConsole.d.ts +3 -3
- package/types/router/core/common/strings.d.ts +4 -2
- package/types/router/core/common/trace.d.ts +94 -82
- package/types/router/core/globals.d.ts +37 -37
- package/types/router/core/hooks/coreResolvables.d.ts +5 -3
- package/types/router/core/hooks/ignoredTransition.d.ts +4 -2
- package/types/router/core/hooks/invalidTransition.d.ts +4 -2
- package/types/router/core/hooks/lazyLoad.d.ts +10 -5
- package/types/router/core/hooks/onEnterExitRetain.d.ts +10 -4
- package/types/router/core/hooks/redirectTo.d.ts +4 -2
- package/types/router/core/hooks/resolve.d.ts +10 -4
- package/types/router/core/hooks/updateGlobals.d.ts +4 -2
- package/types/router/core/hooks/url.d.ts +4 -2
- package/types/router/core/hooks/views.d.ts +7 -3
- package/types/router/core/index.d.ts +11 -12
- package/types/router/core/interface.d.ts +83 -81
- package/types/router/core/params/index.d.ts +5 -5
- package/types/router/core/params/interface.d.ts +439 -439
- package/types/router/core/params/param.d.ts +72 -60
- package/types/router/core/params/paramType.d.ts +40 -40
- package/types/router/core/params/paramTypes.d.ts +169 -165
- package/types/router/core/params/stateParams.d.ts +13 -13
- package/types/router/core/path/index.d.ts +2 -2
- package/types/router/core/path/pathNode.d.ts +49 -49
- package/types/router/core/path/pathUtils.d.ts +100 -74
- package/types/router/core/resolve/index.d.ts +3 -3
- package/types/router/core/resolve/interface.d.ts +137 -137
- package/types/router/core/resolve/resolvable.d.ts +60 -54
- package/types/router/core/resolve/resolveContext.d.ts +84 -79
- package/types/router/core/router.d.ts +95 -86
- package/types/router/core/state/index.d.ts +8 -8
- package/types/router/core/state/interface.d.ts +667 -643
- package/types/router/core/state/stateBuilder.d.ts +41 -38
- package/types/router/core/state/stateMatcher.d.ts +11 -9
- package/types/router/core/state/stateObject.d.ts +154 -139
- package/types/router/core/state/stateQueueManager.d.ts +26 -21
- package/types/router/core/state/stateRegistry.d.ts +124 -121
- package/types/router/core/state/stateService.d.ts +380 -343
- package/types/router/core/state/targetState.d.ts +74 -69
- package/types/router/core/transition/hookBuilder.d.ts +34 -30
- package/types/router/core/transition/hookRegistry.d.ts +96 -74
- package/types/router/core/transition/index.d.ts +8 -8
- package/types/router/core/transition/interface.d.ts +652 -609
- package/types/router/core/transition/rejectFactory.d.ts +97 -97
- package/types/router/core/transition/transition.d.ts +565 -517
- package/types/router/core/transition/transitionEventType.d.ts +20 -11
- package/types/router/core/transition/transitionHook.d.ts +90 -82
- package/types/router/core/transition/transitionService.d.ts +228 -161
- package/types/router/core/url/index.d.ts +8 -8
- package/types/router/core/url/interface.d.ts +100 -87
- package/types/router/core/url/urlConfig.d.ts +130 -126
- package/types/router/core/url/urlMatcher.d.ts +132 -127
- package/types/router/core/url/urlMatcherFactory.d.ts +46 -42
- package/types/router/core/url/urlRouter.d.ts +91 -75
- package/types/router/core/url/urlRule.d.ts +123 -100
- package/types/router/core/url/urlRules.d.ts +240 -232
- package/types/router/core/url/urlService.d.ts +201 -201
- package/types/router/core/view/index.d.ts +2 -2
- package/types/router/core/view/interface.d.ts +26 -26
- package/types/router/core/view/view.d.ts +152 -143
- package/types/router/directives/viewDirective.d.ts +12 -11
- package/types/router/index.d.ts +11 -12
- package/types/router/interface.d.ts +361 -351
- package/types/router/legacy/resolveService.d.ts +44 -40
- package/types/router/legacy/stateEvents.d.ts +1 -1
- package/types/router/locationServices.d.ts +45 -37
- package/types/router/services.d.ts +9 -9
- package/types/router/stateFilters.d.ts +3 -3
- package/types/router/stateProvider.d.ts +240 -235
- package/types/router/statebuilders/onEnterExitRetain.d.ts +4 -2
- package/types/router/statebuilders/views.d.ts +35 -22
- package/types/router/templateFactory.d.ts +99 -79
- package/types/router/viewScroll.d.ts +7 -7
- package/src/directive/a.js +0 -37
- package/test/directive/a.spec.js +0 -192
- package/types/router/angular.d.ts +0 -1
- package/types/router/core/vanilla.d.ts +0 -1
- package/types/router/directives/stateDirectives.d.ts +0 -3
- package/types/router/injectables.d.ts +0 -1
package/index.html
CHANGED
|
@@ -17,7 +17,6 @@
|
|
|
17
17
|
<!-- <script src="dist/angular-ts.umd.js"></script> -->
|
|
18
18
|
<!-- include spec files here... -->
|
|
19
19
|
|
|
20
|
-
<script type="module" src="test/directive/a.spec.js"></script>
|
|
21
20
|
<script type="module" src="test/directive/boolean.spec.js"></script>
|
|
22
21
|
<script type="module" src="test/directive/form.spec.js"></script>
|
|
23
22
|
<script type="module" src="test/directive/input.spec.js"></script>
|
|
@@ -100,6 +99,8 @@
|
|
|
100
99
|
|
|
101
100
|
<!-- Router specs-->
|
|
102
101
|
<script type="module" src="test/router/glob.spec.js"></script>
|
|
102
|
+
<script type="module" src="test/router/services.spec.js"></script>
|
|
103
|
+
<script type="module" src="test/router/state-directives.spec.js"></script>
|
|
103
104
|
<script type="module" src="test/router/state-filter.spec.js"></script>
|
|
104
105
|
<script type="module" src="test/router/state.spec.js"></script>
|
|
105
106
|
|
package/package.json
CHANGED
|
@@ -193,8 +193,8 @@ export const $$AnimateCssDriverProvider = [
|
|
|
193
193
|
}
|
|
194
194
|
|
|
195
195
|
function prepareFromToAnchorAnimation(from, to, classes, anchors) {
|
|
196
|
-
const fromAnimation = prepareRegularAnimation(from
|
|
197
|
-
const toAnimation = prepareRegularAnimation(to
|
|
196
|
+
const fromAnimation = prepareRegularAnimation(from);
|
|
197
|
+
const toAnimation = prepareRegularAnimation(to);
|
|
198
198
|
|
|
199
199
|
const anchorAnimations = [];
|
|
200
200
|
forEach(anchors, (anchor) => {
|
|
@@ -378,7 +378,7 @@ export const $AnimateCssProvider = [
|
|
|
378
378
|
let timings = $$animateCache.get(cacheKey);
|
|
379
379
|
|
|
380
380
|
if (!timings) {
|
|
381
|
-
timings = computeCssStyles(
|
|
381
|
+
timings = computeCssStyles(node, properties);
|
|
382
382
|
if (timings.animationIterationCount === "infinite") {
|
|
383
383
|
timings.animationIterationCount = 1;
|
|
384
384
|
}
|
|
@@ -417,7 +417,7 @@ export const $AnimateCssProvider = [
|
|
|
417
417
|
const staggerClassName = pendClasses(className, "-stagger");
|
|
418
418
|
|
|
419
419
|
node.className += ` ${staggerClassName}`;
|
|
420
|
-
stagger = computeCssStyles(
|
|
420
|
+
stagger = computeCssStyles(node, properties);
|
|
421
421
|
|
|
422
422
|
// force the conversion of a null value to zero incase not set
|
|
423
423
|
stagger.animationDuration = Math.max(
|
|
@@ -654,7 +654,7 @@ export const $AnimateCssProvider = [
|
|
|
654
654
|
// that if there is no transition defined then nothing will happen and this will also allow
|
|
655
655
|
// other transitions to be stacked on top of each other without any chopping them out.
|
|
656
656
|
if (isFirst && !options.skipBlocking) {
|
|
657
|
-
|
|
657
|
+
blockTransitions(node, SAFE_FAST_FORWARD_DURATION_VALUE);
|
|
658
658
|
}
|
|
659
659
|
|
|
660
660
|
let timings = computeTimings(
|
|
@@ -765,7 +765,7 @@ export const $AnimateCssProvider = [
|
|
|
765
765
|
if (flags.blockTransition || flags.blockKeyframeAnimation) {
|
|
766
766
|
applyBlocking(maxDuration);
|
|
767
767
|
} else if (!options.skipBlocking) {
|
|
768
|
-
|
|
768
|
+
blockTransitions(node, false);
|
|
769
769
|
}
|
|
770
770
|
|
|
771
771
|
// TODO(matsko): for 1.5 change this code to have an animator object for better debugging
|
|
@@ -823,7 +823,7 @@ export const $AnimateCssProvider = [
|
|
|
823
823
|
}
|
|
824
824
|
|
|
825
825
|
blockKeyframeAnimations(node, false);
|
|
826
|
-
|
|
826
|
+
blockTransitions(node, false);
|
|
827
827
|
|
|
828
828
|
forEach(temporaryStyles, (entry) => {
|
|
829
829
|
// There is only one way to remove inline style properties entirely from elements.
|
|
@@ -874,7 +874,7 @@ export const $AnimateCssProvider = [
|
|
|
874
874
|
|
|
875
875
|
function applyBlocking(duration) {
|
|
876
876
|
if (flags.blockTransition) {
|
|
877
|
-
|
|
877
|
+
blockTransitions(node, duration);
|
|
878
878
|
}
|
|
879
879
|
|
|
880
880
|
if (flags.blockKeyframeAnimation) {
|
|
@@ -1136,3 +1136,12 @@ export const $AnimateCssProvider = [
|
|
|
1136
1136
|
];
|
|
1137
1137
|
},
|
|
1138
1138
|
];
|
|
1139
|
+
|
|
1140
|
+
function blockTransitions(node, duration) {
|
|
1141
|
+
// we use a negative delay value since it performs blocking
|
|
1142
|
+
// yet it doesn't kill any existing transitions running on the
|
|
1143
|
+
// same element which makes this safe for class-based animations
|
|
1144
|
+
const value = duration ? `-${duration}s` : "";
|
|
1145
|
+
applyInlineStyle(node, [TRANSITION_DELAY_PROP, value]);
|
|
1146
|
+
return [TRANSITION_DELAY_PROP, value];
|
|
1147
|
+
}
|
|
@@ -470,7 +470,7 @@ export const $$AnimateQueueProvider = [
|
|
|
470
470
|
(!hasExistingAnimation ||
|
|
471
471
|
existingAnimation.state !== PRE_DIGEST_STATE)
|
|
472
472
|
) {
|
|
473
|
-
skipAnimations = !areAnimationsAllowed(node, parentNode
|
|
473
|
+
skipAnimations = !areAnimationsAllowed(node, parentNode);
|
|
474
474
|
}
|
|
475
475
|
|
|
476
476
|
if (skipAnimations) {
|
package/src/animations/shared.js
CHANGED
|
@@ -35,7 +35,6 @@ if (
|
|
|
35
35
|
TRANSITIONEND_EVENT = "webkitTransitionEnd transitionend";
|
|
36
36
|
} else {
|
|
37
37
|
TRANSITION_PROP = "transition";
|
|
38
|
-
// eslint-disable-next-line no-unused-vars
|
|
39
38
|
TRANSITIONEND_EVENT = "transitionend";
|
|
40
39
|
}
|
|
41
40
|
|
|
@@ -43,13 +42,11 @@ if (
|
|
|
43
42
|
window.onanimationend === undefined &&
|
|
44
43
|
window.onwebkitanimationend !== undefined
|
|
45
44
|
) {
|
|
46
|
-
// eslint-disable-next-line no-unused-vars
|
|
47
45
|
CSS_PREFIX = "-webkit-";
|
|
48
46
|
ANIMATION_PROP = "WebkitAnimation";
|
|
49
47
|
ANIMATIONEND_EVENT = "webkitAnimationEnd animationend";
|
|
50
48
|
} else {
|
|
51
49
|
ANIMATION_PROP = "animation";
|
|
52
|
-
// eslint-disable-next-line no-unused-vars
|
|
53
50
|
ANIMATIONEND_EVENT = "animationend";
|
|
54
51
|
}
|
|
55
52
|
|
|
@@ -365,14 +362,3 @@ export function concatWithSpace(a, b) {
|
|
|
365
362
|
if (!b) return a;
|
|
366
363
|
return `${a} ${b}`;
|
|
367
364
|
}
|
|
368
|
-
|
|
369
|
-
export const helpers = {
|
|
370
|
-
blockTransitions(node, duration) {
|
|
371
|
-
// we use a negative delay value since it performs blocking
|
|
372
|
-
// yet it doesn't kill any existing transitions running on the
|
|
373
|
-
// same element which makes this safe for class-based animations
|
|
374
|
-
const value = duration ? `-${duration}s` : "";
|
|
375
|
-
applyInlineStyle(node, [TRANSITION_DELAY_PROP, value]);
|
|
376
|
-
return [TRANSITION_DELAY_PROP, value];
|
|
377
|
-
},
|
|
378
|
-
};
|
package/src/core/compile.js
CHANGED
|
@@ -44,6 +44,7 @@ import { CACHE, EXPANDO } from "./cache";
|
|
|
44
44
|
const $compileMinErr = minErr("$compile");
|
|
45
45
|
|
|
46
46
|
const _UNINITIALIZED_VALUE = new Object();
|
|
47
|
+
const EXCLUDED_DIRECTIVES = ["ngIf", "ngRepeat"];
|
|
47
48
|
let TTL = 10;
|
|
48
49
|
|
|
49
50
|
/**
|
|
@@ -1692,7 +1693,8 @@ export function $CompileProvider($provide, $$sanitizeUriProvider) {
|
|
|
1692
1693
|
!didScanForMultipleTransclusion &&
|
|
1693
1694
|
((directive.replace &&
|
|
1694
1695
|
(directive.templateUrl || directive.template)) ||
|
|
1695
|
-
(directive.transclude &&
|
|
1696
|
+
(directive.transclude &&
|
|
1697
|
+
!EXCLUDED_DIRECTIVES.includes(directive.name)))
|
|
1696
1698
|
) {
|
|
1697
1699
|
let candidateDirective;
|
|
1698
1700
|
|
|
@@ -1702,7 +1704,8 @@ export function $CompileProvider($provide, $$sanitizeUriProvider) {
|
|
|
1702
1704
|
|
|
1703
1705
|
) {
|
|
1704
1706
|
if (
|
|
1705
|
-
(candidateDirective.transclude &&
|
|
1707
|
+
(candidateDirective.transclude &&
|
|
1708
|
+
!EXCLUDED_DIRECTIVES.includes(candidateDirective.name)) ||
|
|
1706
1709
|
(candidateDirective.replace &&
|
|
1707
1710
|
(candidateDirective.templateUrl ||
|
|
1708
1711
|
candidateDirective.template))
|
|
@@ -1734,7 +1737,7 @@ export function $CompileProvider($provide, $$sanitizeUriProvider) {
|
|
|
1734
1737
|
// Special case ngIf and ngRepeat so that we don't complain about duplicate transclusion.
|
|
1735
1738
|
// This option should only be used by directives that know how to safely handle element transclusion,
|
|
1736
1739
|
// where the transcluded nodes are added or replaced after linking.
|
|
1737
|
-
if (!directive
|
|
1740
|
+
if (!EXCLUDED_DIRECTIVES.includes(directive.name)) {
|
|
1738
1741
|
assertNoDuplicate(
|
|
1739
1742
|
"transclusion",
|
|
1740
1743
|
nonTlbTranscludeDirective,
|
package/src/core/q.js
CHANGED
|
@@ -328,7 +328,7 @@ function qFactory(nextTick, exceptionHandler, errorOnUnhandledRejections) {
|
|
|
328
328
|
}
|
|
329
329
|
|
|
330
330
|
function Deferred() {
|
|
331
|
-
const promise = (this.promise = new
|
|
331
|
+
const promise = (this.promise = new QPromise());
|
|
332
332
|
// Non prototype methods necessary to support unbound execution :/
|
|
333
333
|
this.resolve = function (val) {
|
|
334
334
|
resolvePromise(promise, val);
|
|
@@ -341,11 +341,11 @@ function qFactory(nextTick, exceptionHandler, errorOnUnhandledRejections) {
|
|
|
341
341
|
};
|
|
342
342
|
}
|
|
343
343
|
|
|
344
|
-
function
|
|
344
|
+
function QPromise() {
|
|
345
345
|
this.$$state = { status: 0 };
|
|
346
346
|
}
|
|
347
347
|
|
|
348
|
-
extend(
|
|
348
|
+
extend(QPromise.prototype, {
|
|
349
349
|
then(onFulfilled, onRejected, progressBack) {
|
|
350
350
|
if (
|
|
351
351
|
isUndefined(onFulfilled) &&
|
|
@@ -354,7 +354,7 @@ function qFactory(nextTick, exceptionHandler, errorOnUnhandledRejections) {
|
|
|
354
354
|
) {
|
|
355
355
|
return this;
|
|
356
356
|
}
|
|
357
|
-
const result = new
|
|
357
|
+
const result = new QPromise();
|
|
358
358
|
|
|
359
359
|
this.$$state.pending = this.$$state.pending || [];
|
|
360
360
|
this.$$state.pending.push([
|
|
@@ -572,7 +572,7 @@ function qFactory(nextTick, exceptionHandler, errorOnUnhandledRejections) {
|
|
|
572
572
|
* @returns {Promise} Returns a promise that was already resolved as rejected with the `reason`.
|
|
573
573
|
*/
|
|
574
574
|
function reject(reason) {
|
|
575
|
-
const result = new
|
|
575
|
+
const result = new QPromise();
|
|
576
576
|
rejectPromise(result, reason);
|
|
577
577
|
return result;
|
|
578
578
|
}
|
|
@@ -608,7 +608,7 @@ function qFactory(nextTick, exceptionHandler, errorOnUnhandledRejections) {
|
|
|
608
608
|
*/
|
|
609
609
|
|
|
610
610
|
function when(value, callback, errback, progressBack) {
|
|
611
|
-
const result = new
|
|
611
|
+
const result = new QPromise();
|
|
612
612
|
resolvePromise(result, value);
|
|
613
613
|
return result.then(callback, errback, progressBack);
|
|
614
614
|
}
|
|
@@ -646,7 +646,7 @@ function qFactory(nextTick, exceptionHandler, errorOnUnhandledRejections) {
|
|
|
646
646
|
*/
|
|
647
647
|
|
|
648
648
|
function all(promises) {
|
|
649
|
-
const result = new
|
|
649
|
+
const result = new QPromise();
|
|
650
650
|
let counter = 0;
|
|
651
651
|
const results = Array.isArray(promises) ? [] : {};
|
|
652
652
|
|
|
@@ -699,7 +699,7 @@ function qFactory(nextTick, exceptionHandler, errorOnUnhandledRejections) {
|
|
|
699
699
|
throw $qMinErr("norslvr", "Expected resolverFn, got '{0}'", resolver);
|
|
700
700
|
}
|
|
701
701
|
|
|
702
|
-
const promise = new
|
|
702
|
+
const promise = new QPromise();
|
|
703
703
|
|
|
704
704
|
function resolveFn(value) {
|
|
705
705
|
resolvePromise(promise, value);
|
|
@@ -716,7 +716,7 @@ function qFactory(nextTick, exceptionHandler, errorOnUnhandledRejections) {
|
|
|
716
716
|
|
|
717
717
|
// Let's make the instanceof operator work for promises, so that
|
|
718
718
|
// `new $q(fn) instanceof $q` would evaluate to true.
|
|
719
|
-
$Q.prototype =
|
|
719
|
+
$Q.prototype = QPromise.prototype;
|
|
720
720
|
|
|
721
721
|
$Q.defer = defer;
|
|
722
722
|
$Q.reject = reject;
|
package/src/core/sanitize-uri.js
CHANGED
|
@@ -28,7 +28,7 @@ export function SanitizeUriProvider() {
|
|
|
28
28
|
* to the DOM it is inactive and potentially malicious code will not be executed.
|
|
29
29
|
*
|
|
30
30
|
* @param {RegExp=} regexp New regexp to trust urls with.
|
|
31
|
-
* @returns {RegExp|ng
|
|
31
|
+
* @returns {RegExp|ng.ICompileProvider} Current RegExp if called without value or self for
|
|
32
32
|
* chaining otherwise.
|
|
33
33
|
*/
|
|
34
34
|
this.aHrefSanitizationTrustedUrlList = function (regexp) {
|
package/src/core/sce.js
CHANGED
|
@@ -487,7 +487,7 @@ export function $SceDelegateProvider() {
|
|
|
487
487
|
);
|
|
488
488
|
} else if (type === SCE_CONTEXTS.HTML) {
|
|
489
489
|
// htmlSanitizer throws its own error when no sanitizer is available.
|
|
490
|
-
return htmlSanitizer(
|
|
490
|
+
return htmlSanitizer();
|
|
491
491
|
}
|
|
492
492
|
// Default error when the $sce service has no way to make the input safe.
|
|
493
493
|
throw $sceMinErr(
|
package/src/directive/if.js
CHANGED
|
@@ -1,83 +1,5 @@
|
|
|
1
1
|
import { getBlockNodes } from "../jqLite";
|
|
2
2
|
|
|
3
|
-
/**
|
|
4
|
-
* @ngdoc directive
|
|
5
|
-
* @name ngIf
|
|
6
|
-
* @restrict A
|
|
7
|
-
* @multiElement
|
|
8
|
-
*
|
|
9
|
-
* @description
|
|
10
|
-
* The `ngIf` directive removes or recreates a portion of the DOM tree based on an
|
|
11
|
-
* {expression}. If the expression assigned to `ngIf` evaluates to a false
|
|
12
|
-
* value then the element is removed from the DOM, otherwise a clone of the
|
|
13
|
-
* element is reinserted into the DOM.
|
|
14
|
-
*
|
|
15
|
-
* `ngIf` differs from `ngShow` and `ngHide` in that `ngIf` completely removes and recreates the
|
|
16
|
-
* element in the DOM rather than changing its visibility via the `display` css property. A common
|
|
17
|
-
* case when this difference is significant is when using css selectors that rely on an element's
|
|
18
|
-
* position within the DOM, such as the `:first-child` or `:last-child` pseudo-classes.
|
|
19
|
-
*
|
|
20
|
-
* Note that when an element is removed using `ngIf` its scope is destroyed and a new scope
|
|
21
|
-
* is created when the element is restored. The scope created within `ngIf` inherits from
|
|
22
|
-
* its parent scope using
|
|
23
|
-
* [prototypal inheritance](https://github.com/angular/angular.js/wiki/Understanding-Scopes#javascript-prototypal-inheritance).
|
|
24
|
-
* An important implication of this is if `ngModel` is used within `ngIf` to bind to
|
|
25
|
-
* a javascript primitive defined in the parent scope. In this case any modifications made to the
|
|
26
|
-
* variable within the child scope will override (hide) the value in the parent scope.
|
|
27
|
-
*
|
|
28
|
-
* Also, `ngIf` recreates elements using their compiled state. An example of this behavior
|
|
29
|
-
* is if an element's class attribute is directly modified after it's compiled, using something like
|
|
30
|
-
* jQuery's `.addClass()` method, and the element is later removed. When `ngIf` recreates the element
|
|
31
|
-
* the added class will be lost because the original compiled state is used to regenerate the element.
|
|
32
|
-
*
|
|
33
|
-
* Additionally, you can provide animations via the `ngAnimate` module to animate the `enter`
|
|
34
|
-
* and `leave` effects.
|
|
35
|
-
*
|
|
36
|
-
* @animations
|
|
37
|
-
* | Animation | Occurs |
|
|
38
|
-
* |----------------------------------|-------------------------------------|
|
|
39
|
-
* | {@link ng.$animate#enter enter} | just after the `ngIf` contents change and a new DOM element is created and injected into the `ngIf` container |
|
|
40
|
-
* | {@link ng.$animate#leave leave} | just before the `ngIf` contents are removed from the DOM |
|
|
41
|
-
*
|
|
42
|
-
* @element ANY
|
|
43
|
-
* @scope
|
|
44
|
-
* @priority 600
|
|
45
|
-
* @param {string} ngIf If the {@link guide/expression expression} is falsy then
|
|
46
|
-
* the element is removed from the DOM tree. If it is truthy a copy of the compiled
|
|
47
|
-
* element is added to the DOM tree.
|
|
48
|
-
*
|
|
49
|
-
* @example
|
|
50
|
-
<example module="ngAnimate" deps="angular-animate.js" animations="true" name="ng-if">
|
|
51
|
-
<file name="index.html">
|
|
52
|
-
<label>Click me: <input type="checkbox" ng-model="checked" ng-init="checked=true" /></label><br/>
|
|
53
|
-
Show when checked:
|
|
54
|
-
<span ng-if="checked" class="animate-if">
|
|
55
|
-
This is removed when the checkbox is unchecked.
|
|
56
|
-
</span>
|
|
57
|
-
</file>
|
|
58
|
-
<file name="animations.css">
|
|
59
|
-
.animate-if {
|
|
60
|
-
background:white;
|
|
61
|
-
border:1px solid black;
|
|
62
|
-
padding:10px;
|
|
63
|
-
}
|
|
64
|
-
|
|
65
|
-
.animate-if.ng-enter, .animate-if.ng-leave {
|
|
66
|
-
transition:all cubic-bezier(0.250, 0.460, 0.450, 0.940) 0.5s;
|
|
67
|
-
}
|
|
68
|
-
|
|
69
|
-
.animate-if.ng-enter,
|
|
70
|
-
.animate-if.ng-leave.ng-leave-active {
|
|
71
|
-
opacity:0;
|
|
72
|
-
}
|
|
73
|
-
|
|
74
|
-
.animate-if.ng-leave,
|
|
75
|
-
.animate-if.ng-enter.ng-enter-active {
|
|
76
|
-
opacity:1;
|
|
77
|
-
}
|
|
78
|
-
</file>
|
|
79
|
-
</example>
|
|
80
|
-
*/
|
|
81
3
|
export const ngIfDirective = [
|
|
82
4
|
"$animate",
|
|
83
5
|
($animate) => ({
|
|
@@ -86,7 +8,6 @@ export const ngIfDirective = [
|
|
|
86
8
|
priority: 600,
|
|
87
9
|
terminal: true,
|
|
88
10
|
restrict: "A",
|
|
89
|
-
$$tlb: true,
|
|
90
11
|
link($scope, $element, $attr, ctrl, $transclude) {
|
|
91
12
|
let block;
|
|
92
13
|
let childScope;
|
|
@@ -0,0 +1,80 @@
|
|
|
1
|
+
/\*\*
|
|
2
|
+
|
|
3
|
+
- @ngdoc directive
|
|
4
|
+
- @name ngIf
|
|
5
|
+
- @restrict A
|
|
6
|
+
- @multiElement
|
|
7
|
+
-
|
|
8
|
+
- @description
|
|
9
|
+
- The `ngIf` directive removes or recreates a portion of the DOM tree based on an
|
|
10
|
+
- {expression}. If the expression assigned to `ngIf` evaluates to a false
|
|
11
|
+
- value then the element is removed from the DOM, otherwise a clone of the
|
|
12
|
+
- element is reinserted into the DOM.
|
|
13
|
+
-
|
|
14
|
+
- `ngIf` differs from `ngShow` and `ngHide` in that `ngIf` completely removes and recreates the
|
|
15
|
+
- element in the DOM rather than changing its visibility via the `display` css property. A common
|
|
16
|
+
- case when this difference is significant is when using css selectors that rely on an element's
|
|
17
|
+
- position within the DOM, such as the `:first-child` or `:last-child` pseudo-classes.
|
|
18
|
+
-
|
|
19
|
+
- Note that when an element is removed using `ngIf` its scope is destroyed and a new scope
|
|
20
|
+
- is created when the element is restored. The scope created within `ngIf` inherits from
|
|
21
|
+
- its parent scope using
|
|
22
|
+
- [prototypal inheritance](https://github.com/angular/angular.js/wiki/Understanding-Scopes#javascript-prototypal-inheritance).
|
|
23
|
+
- An important implication of this is if `ngModel` is used within `ngIf` to bind to
|
|
24
|
+
- a javascript primitive defined in the parent scope. In this case any modifications made to the
|
|
25
|
+
- variable within the child scope will override (hide) the value in the parent scope.
|
|
26
|
+
-
|
|
27
|
+
- Also, `ngIf` recreates elements using their compiled state. An example of this behavior
|
|
28
|
+
- is if an element's class attribute is directly modified after it's compiled, using something like
|
|
29
|
+
- jQuery's `.addClass()` method, and the element is later removed. When `ngIf` recreates the element
|
|
30
|
+
- the added class will be lost because the original compiled state is used to regenerate the element.
|
|
31
|
+
-
|
|
32
|
+
- Additionally, you can provide animations via the `ngAnimate` module to animate the `enter`
|
|
33
|
+
- and `leave` effects.
|
|
34
|
+
-
|
|
35
|
+
- @animations
|
|
36
|
+
- | Animation | Occurs |
|
|
37
|
+
- |----------------------------------|-------------------------------------|
|
|
38
|
+
- | {@link ng.$animate#enter enter} | just after the `ngIf` contents change and a new DOM element is created and injected into the `ngIf` container |
|
|
39
|
+
- | {@link ng.$animate#leave leave} | just before the `ngIf` contents are removed from the DOM |
|
|
40
|
+
-
|
|
41
|
+
- @element ANY
|
|
42
|
+
- @scope
|
|
43
|
+
- @priority 600
|
|
44
|
+
- @param {string} ngIf If the {@link guide/expression expression} is falsy then
|
|
45
|
+
- the element is removed from the DOM tree. If it is truthy a copy of the compiled
|
|
46
|
+
- element is added to the DOM tree.
|
|
47
|
+
-
|
|
48
|
+
- @example
|
|
49
|
+
<example module="ngAnimate" deps="angular-animate.js" animations="true" name="ng-if">
|
|
50
|
+
<file name="index.html">
|
|
51
|
+
<label>Click me: <input type="checkbox" ng-model="checked" ng-init="checked=true" /></label><br/>
|
|
52
|
+
Show when checked:
|
|
53
|
+
<span ng-if="checked" class="animate-if">
|
|
54
|
+
This is removed when the checkbox is unchecked.
|
|
55
|
+
</span>
|
|
56
|
+
</file>
|
|
57
|
+
<file name="animations.css">
|
|
58
|
+
.animate-if {
|
|
59
|
+
background:white;
|
|
60
|
+
border:1px solid black;
|
|
61
|
+
padding:10px;
|
|
62
|
+
}
|
|
63
|
+
|
|
64
|
+
.animate-if.ng-enter, .animate-if.ng-leave {
|
|
65
|
+
transition:all cubic-bezier(0.250, 0.460, 0.450, 0.940) 0.5s;
|
|
66
|
+
}
|
|
67
|
+
|
|
68
|
+
.animate-if.ng-enter,
|
|
69
|
+
.animate-if.ng-leave.ng-leave-active {
|
|
70
|
+
opacity:0;
|
|
71
|
+
}
|
|
72
|
+
|
|
73
|
+
.animate-if.ng-leave,
|
|
74
|
+
.animate-if.ng-enter.ng-enter-active {
|
|
75
|
+
opacity:1;
|
|
76
|
+
}
|
|
77
|
+
|
|
78
|
+
</file>
|
|
79
|
+
</example>
|
|
80
|
+
*/
|
package/src/directive/include.js
CHANGED
|
@@ -1,88 +1,6 @@
|
|
|
1
1
|
import { isDefined } from "../shared/utils";
|
|
2
2
|
import { jqLiteBuildFragment } from "../jqLite";
|
|
3
|
-
/**
|
|
4
|
-
* @ngdoc directive
|
|
5
|
-
* @name ngInclude
|
|
6
|
-
* @restrict ECA
|
|
7
|
-
* @scope
|
|
8
|
-
* @priority -400
|
|
9
|
-
*
|
|
10
|
-
* @description
|
|
11
|
-
* Fetches, compiles and includes an external HTML fragment.
|
|
12
|
-
*
|
|
13
|
-
* By default, the template URL is restricted to the same domain and protocol as the
|
|
14
|
-
* application document. This is done by calling {@link $sce#getTrustedResourceUrl
|
|
15
|
-
* $sce.getTrustedResourceUrl} on it. To load templates from other domains or protocols
|
|
16
|
-
* you may either add them to your {@link ng.$sceDelegateProvider#trustedResourceUrlList trusted
|
|
17
|
-
* resource URL list} or {@link $sce#trustAsResourceUrl wrap them} as trusted values. Refer to
|
|
18
|
-
* AngularJS's {@link ng.$sce Strict Contextual Escaping}.
|
|
19
|
-
*
|
|
20
|
-
* In addition, the browser's
|
|
21
|
-
* [Same Origin Policy](https://code.google.com/p/browsersec/wiki/Part2#Same-origin_policy_for_XMLHttpRequest)
|
|
22
|
-
* and [Cross-Origin Resource Sharing (CORS)](http://www.w3.org/TR/cors/)
|
|
23
|
-
* policy may further restrict whether the template is successfully loaded.
|
|
24
|
-
* For example, `ngInclude` won't work for cross-domain requests on all browsers and for `file://`
|
|
25
|
-
* access on some browsers.
|
|
26
|
-
*
|
|
27
|
-
* @animations
|
|
28
|
-
* | Animation | Occurs |
|
|
29
|
-
* |----------------------------------|-------------------------------------|
|
|
30
|
-
* | {@link ng.$animate#enter enter} | when the expression changes, on the new include |
|
|
31
|
-
* | {@link ng.$animate#leave leave} | when the expression changes, on the old include |
|
|
32
|
-
*
|
|
33
|
-
* The enter and leave animation occur concurrently.
|
|
34
|
-
*
|
|
35
|
-
* @param {string} ngInclude|src AngularJS expression evaluating to URL. If the source is a string constant,
|
|
36
|
-
* make sure you wrap it in **single** quotes, e.g. `src="'myPartialTemplate.html'"`.
|
|
37
|
-
* @param {string=} onload Expression to evaluate when a new partial is loaded.
|
|
38
|
-
* <div class="alert alert-warning">
|
|
39
|
-
* **Note:** When using onload on SVG elements in IE11, the browser will try to call
|
|
40
|
-
* a function with the name on the window element, which will usually throw a
|
|
41
|
-
* "function is undefined" error. To fix this, you can instead use `data-onload` or a
|
|
42
|
-
* different form that {@link guide/directive#normalization matches} `onload`.
|
|
43
|
-
* </div>
|
|
44
|
-
*
|
|
45
|
-
* @param {string=} autoscroll Whether `ngInclude` should call {@link ng.$anchorScroll
|
|
46
|
-
* $anchorScroll} to scroll the viewport after the content is loaded.
|
|
47
|
-
*
|
|
48
|
-
* - If the attribute is not set, disable scrolling.
|
|
49
|
-
* - If the attribute is set without value, enable scrolling.
|
|
50
|
-
* - Otherwise enable scrolling only if the expression evaluates to truthy value.
|
|
51
|
-
*
|
|
52
|
-
*/
|
|
53
3
|
|
|
54
|
-
/**
|
|
55
|
-
* @ngdoc event
|
|
56
|
-
* @name ngInclude#$includeContentRequested
|
|
57
|
-
* @eventType emit on the scope ngInclude was declared in
|
|
58
|
-
* @description
|
|
59
|
-
* Emitted every time the ngInclude content is requested.
|
|
60
|
-
*
|
|
61
|
-
* @param {Object} angularEvent Synthetic event object.
|
|
62
|
-
* @param {String} src URL of content to load.
|
|
63
|
-
*/
|
|
64
|
-
|
|
65
|
-
/**
|
|
66
|
-
* @ngdoc event
|
|
67
|
-
* @name ngInclude#$includeContentLoaded
|
|
68
|
-
* @eventType emit on the current ngInclude scope
|
|
69
|
-
* @description
|
|
70
|
-
* Emitted every time the ngInclude content is reloaded.
|
|
71
|
-
*
|
|
72
|
-
* @param {Object} angularEvent Synthetic event object.
|
|
73
|
-
* @param {String} src URL of content to load.
|
|
74
|
-
*/
|
|
75
|
-
|
|
76
|
-
/**
|
|
77
|
-
* @ngdoc event
|
|
78
|
-
* @name ngInclude#$includeContentError
|
|
79
|
-
* @eventType emit on the scope ngInclude was declared in
|
|
80
|
-
* @description
|
|
81
|
-
* Emitted when a template HTTP request yields an erroneous response (status < 200 || status > 299)
|
|
82
|
-
*
|
|
83
|
-
* @param {Object} angularEvent Synthetic event object.
|
|
84
|
-
* @param {String} src URL of content to load.
|
|
85
|
-
*/
|
|
86
4
|
export const ngIncludeDirective = [
|
|
87
5
|
"$templateRequest",
|
|
88
6
|
"$anchorScroll",
|
|
@@ -0,0 +1,86 @@
|
|
|
1
|
+
/\*\*
|
|
2
|
+
|
|
3
|
+
- @ngdoc directive
|
|
4
|
+
- @name ngInclude
|
|
5
|
+
- @restrict ECA
|
|
6
|
+
- @scope
|
|
7
|
+
- @priority -400
|
|
8
|
+
-
|
|
9
|
+
- @description
|
|
10
|
+
- Fetches, compiles and includes an external HTML fragment.
|
|
11
|
+
-
|
|
12
|
+
- By default, the template URL is restricted to the same domain and protocol as the
|
|
13
|
+
- application document. This is done by calling {@link $sce#getTrustedResourceUrl
|
|
14
|
+
- $sce.getTrustedResourceUrl} on it. To load templates from other domains or protocols
|
|
15
|
+
- you may either add them to your {@link ng.$sceDelegateProvider#trustedResourceUrlList trusted
|
|
16
|
+
- resource URL list} or {@link $sce#trustAsResourceUrl wrap them} as trusted values. Refer to
|
|
17
|
+
- AngularJS's {@link ng.$sce Strict Contextual Escaping}.
|
|
18
|
+
-
|
|
19
|
+
- In addition, the browser's
|
|
20
|
+
- [Same Origin Policy](https://code.google.com/p/browsersec/wiki/Part2#Same-origin_policy_for_XMLHttpRequest)
|
|
21
|
+
- and [Cross-Origin Resource Sharing (CORS)](http://www.w3.org/TR/cors/)
|
|
22
|
+
- policy may further restrict whether the template is successfully loaded.
|
|
23
|
+
- For example, `ngInclude` won't work for cross-domain requests on all browsers and for `file://`
|
|
24
|
+
- access on some browsers.
|
|
25
|
+
-
|
|
26
|
+
- @animations
|
|
27
|
+
- | Animation | Occurs |
|
|
28
|
+
- |----------------------------------|-------------------------------------|
|
|
29
|
+
- | {@link ng.$animate#enter enter} | when the expression changes, on the new include |
|
|
30
|
+
- | {@link ng.$animate#leave leave} | when the expression changes, on the old include |
|
|
31
|
+
-
|
|
32
|
+
- The enter and leave animation occur concurrently.
|
|
33
|
+
-
|
|
34
|
+
- @param {string} ngInclude|src AngularJS expression evaluating to URL. If the source is a string constant,
|
|
35
|
+
- make sure you wrap it in **single** quotes, e.g. `src="'myPartialTemplate.html'"`.
|
|
36
|
+
- @param {string=} onload Expression to evaluate when a new partial is loaded.
|
|
37
|
+
- <div class="alert alert-warning">
|
|
38
|
+
- **Note:** When using onload on SVG elements in IE11, the browser will try to call
|
|
39
|
+
- a function with the name on the window element, which will usually throw a
|
|
40
|
+
- "function is undefined" error. To fix this, you can instead use `data-onload` or a
|
|
41
|
+
- different form that {@link guide/directive#normalization matches} `onload`.
|
|
42
|
+
- </div>
|
|
43
|
+
-
|
|
44
|
+
- @param {string=} autoscroll Whether `ngInclude` should call {@link ng.$anchorScroll
|
|
45
|
+
- $anchorScroll} to scroll the viewport after the content is loaded.
|
|
46
|
+
-
|
|
47
|
+
- - If the attribute is not set, disable scrolling.
|
|
48
|
+
- - If the attribute is set without value, enable scrolling.
|
|
49
|
+
- - Otherwise enable scrolling only if the expression evaluates to truthy value.
|
|
50
|
+
- \*/
|
|
51
|
+
|
|
52
|
+
/\*\*
|
|
53
|
+
|
|
54
|
+
- @ngdoc event
|
|
55
|
+
- @name ngInclude#$includeContentRequested
|
|
56
|
+
- @eventType emit on the scope ngInclude was declared in
|
|
57
|
+
- @description
|
|
58
|
+
- Emitted every time the ngInclude content is requested.
|
|
59
|
+
-
|
|
60
|
+
- @param {Object} angularEvent Synthetic event object.
|
|
61
|
+
- @param {String} src URL of content to load.
|
|
62
|
+
\*/
|
|
63
|
+
|
|
64
|
+
/\*\*
|
|
65
|
+
|
|
66
|
+
- @ngdoc event
|
|
67
|
+
- @name ngInclude#$includeContentLoaded
|
|
68
|
+
- @eventType emit on the current ngInclude scope
|
|
69
|
+
- @description
|
|
70
|
+
- Emitted every time the ngInclude content is reloaded.
|
|
71
|
+
-
|
|
72
|
+
- @param {Object} angularEvent Synthetic event object.
|
|
73
|
+
- @param {String} src URL of content to load.
|
|
74
|
+
\*/
|
|
75
|
+
|
|
76
|
+
/\*\*
|
|
77
|
+
|
|
78
|
+
- @ngdoc event
|
|
79
|
+
- @name ngInclude#$includeContentError
|
|
80
|
+
- @eventType emit on the scope ngInclude was declared in
|
|
81
|
+
- @description
|
|
82
|
+
- Emitted when a template HTTP request yields an erroneous response (status < 200 || status > 299)
|
|
83
|
+
-
|
|
84
|
+
- @param {Object} angularEvent Synthetic event object.
|
|
85
|
+
- @param {String} src URL of content to load.
|
|
86
|
+
\*/
|
package/src/directive/repeat.js
CHANGED