mirror of
https://github.com/angular/angular.git
synced 2026-09-14 13:54:52 +08:00
Compare commits
47 Commits
| Author | SHA1 | Date | |
|---|---|---|---|
| 380377139b | |||
| 9c7680ef69 | |||
| 69572ac2f1 | |||
| 76f53f929c | |||
| ba52f2f252 | |||
| e122f6bf0f | |||
| 453c758d1a | |||
| 015ca47336 | |||
| f32e287812 | |||
| 9946ac5cc7 | |||
| 593e05dc97 | |||
| da77b580c9 | |||
| 1733ea09bd | |||
| 1f4fa28fac | |||
| c12e56ec0c | |||
| 4a5c8bd25f | |||
| 9c954740d1 | |||
| 11ed8f56ab | |||
| a49acbf027 | |||
| 8e41910429 | |||
| a4ab14bf74 | |||
| ea4fc9b421 | |||
| 0956acee58 | |||
| 2ca67e1674 | |||
| 472666fc2b | |||
| 462316b0f1 | |||
| 96c2b2cc25 | |||
| 3d407fc010 | |||
| 64bd672e3a | |||
| ef38676091 | |||
| 38be2b81c6 | |||
| 39a71eb0ec | |||
| 2fe6fb1163 | |||
| b5afe51b26 | |||
| 170525a225 | |||
| 0c98f45105 | |||
| e7025c9423 | |||
| 8f295287a2 | |||
| 030facc66a | |||
| 45af8f6752 | |||
| 33a79028be | |||
| 09226d96f8 | |||
| 6c3166e6e4 | |||
| 8df328b15a | |||
| 115f18fa06 | |||
| 511cd4d182 | |||
| 87d5d49530 |
@@ -1,3 +1,53 @@
|
||||
<a name="2.2.3"></a>
|
||||
## [2.2.3](https://github.com/angular/angular/compare/2.2.2...2.2.3) (2016-11-23)
|
||||
|
||||
### Bug Fixes
|
||||
|
||||
* **compiler:** Revert: fix versions of `@angular/tsc-wrapped` ([015ca47](https://github.com/angular/angular/commit/015ca47))
|
||||
* **animations:** Revert: blend in all previously transitioned styles into next animation if interrupted ([c12e56e](https://github.com/angular/angular/commit/c12e56e))
|
||||
|
||||
|
||||
<a name="2.2.2"></a>
|
||||
## [2.2.2](https://github.com/angular/angular/compare/2.2.1...2.2.2) (2016-11-22)
|
||||
|
||||
|
||||
### Bug Fixes
|
||||
|
||||
* **animations:** blend in all previously transitioned styles into next animation if interrupted ([#13014](https://github.com/angular/angular/issues/13014)) ([ea4fc9b](https://github.com/angular/angular/commit/ea4fc9b)), closes [#13013](https://github.com/angular/angular/issues/13013)
|
||||
* **benchmarks:** use sanitized style values ([#12943](https://github.com/angular/angular/issues/12943)) ([33a7902](https://github.com/angular/angular/commit/33a7902))
|
||||
* **closure:** quote date pattern aliases ([#13012](https://github.com/angular/angular/issues/13012)) ([0956ace](https://github.com/angular/angular/commit/0956ace))
|
||||
* **compiler:** fix versions of `@angular/tsc-wrapped` ([2fe6fb1](https://github.com/angular/angular/commit/2fe6fb1))
|
||||
* **router:** add a banner file for the router ([#12919](https://github.com/angular/angular/issues/12919)) ([8df328b](https://github.com/angular/angular/commit/8df328b))
|
||||
* **router:** add a banner file for the router ([#12919](https://github.com/angular/angular/issues/12919)) ([511cd4d](https://github.com/angular/angular/commit/511cd4d))
|
||||
* **router:** removes a peer dependency from router to upgrade ([115f18f](https://github.com/angular/angular/commit/115f18f))
|
||||
* **router:** removes a peer dependency from router to upgrade ([87d5d49](https://github.com/angular/angular/commit/87d5d49))
|
||||
* **router:** support redirects to named outlets ([09226d9](https://github.com/angular/angular/commit/09226d9)), closes [#12740](https://github.com/angular/angular/issues/12740) [#9921](https://github.com/angular/angular/issues/9921)
|
||||
* **upgrade:** call ng1 lifecycle hooks ([#12875](https://github.com/angular/angular/issues/12875)) ([462316b](https://github.com/angular/angular/commit/462316b))
|
||||
|
||||
|
||||
|
||||
<a name="2.3.0-beta.0"></a>
|
||||
# [2.3.0-beta.0](https://github.com/angular/angular/compare/2.2.0...2.3.0-beta.0) (2016-11-17)
|
||||
|
||||
### Bug Fixes
|
||||
|
||||
* **compiler:** assert xliff messages have translations ([7908679](https://github.com/angular/angular/commit/7908679)), closes [#12815](https://github.com/angular/angular/issues/12815) [#12604](https://github.com/angular/angular/issues/12604)
|
||||
* **compiler:** updates hash algo for xmb/xtb files ([2f14415](https://github.com/angular/angular/commit/2f14415))
|
||||
* **core:** fix placeholders handling in i18n. ([76e4911](https://github.com/angular/angular/commit/76e4911)), closes [#12512](https://github.com/angular/angular/issues/12512)
|
||||
* **core:** misc i18n fixes ([ed5e98d](https://github.com/angular/angular/commit/ed5e98d))
|
||||
* **core:** xmb serializer uses decimal messaged IDs ([08c038e](https://github.com/angular/angular/commit/08c038e)), closes [#12511](https://github.com/angular/angular/issues/12511)
|
||||
* **platform-browser:** enable AOT ([efbbefd](https://github.com/angular/angular/commit/efbbefd)), closes [#12783](https://github.com/angular/angular/issues/12783)
|
||||
|
||||
### Features
|
||||
|
||||
* **core:** add `attachView` / `detachView` to ApplicationRef ([9f7d32a](https://github.com/angular/angular/commit/9f7d32a)), closes [#9293](https://github.com/angular/angular/issues/9293)
|
||||
* **core:** expose `ViewRef` as `ChangeDetectorRef` ([1b5384e](https://github.com/angular/angular/commit/1b5384e)), closes [#12722](https://github.com/angular/angular/issues/12722)
|
||||
* **core:** implements a decimal fingerprint for i18n ([582550a](https://github.com/angular/angular/commit/582550a))
|
||||
* **router:** register router with ngprobe ([c2fae72](https://github.com/angular/angular/commit/c2fae72))
|
||||
* **router_link:** add skipLocationChange and replaceUrl inputs ([#12850](https://github.com/angular/angular/issues/12850)) ([46d1502](https://github.com/angular/angular/commit/46d1502))
|
||||
|
||||
Note: The 2.3.0-beta.0 release also contains all the changes present in the 2.2.1 release.
|
||||
|
||||
<a name="2.2.1"></a>
|
||||
## [2.2.1](https://github.com/angular/angular/compare/2.2.0...2.2.1) (2016-11-17)
|
||||
|
||||
|
||||
@@ -20,6 +20,10 @@ PACKAGES=(core
|
||||
benchpress)
|
||||
BUILD_ALL=true
|
||||
BUNDLE=true
|
||||
VERSION_PREFIX=$(node -p "require('./package.json').version")
|
||||
VERSION_SUFFIX="-$(git log --oneline -1 | awk '{print $1}')"
|
||||
ROUTER_VERSION_PREFIX=$(node -p "require('./package.json').version.replace(/^2/, '3')")
|
||||
REMOVE_BENCHPRESS=false
|
||||
|
||||
for ARG in "$@"; do
|
||||
case "$ARG" in
|
||||
@@ -31,6 +35,10 @@ for ARG in "$@"; do
|
||||
--bundle=*)
|
||||
BUNDLE=( "${ARG#--bundle=}" )
|
||||
;;
|
||||
--publish)
|
||||
VERSION_SUFFIX=""
|
||||
REMOVE_BENCHPRESS=true
|
||||
;;
|
||||
*)
|
||||
echo "Unknown option $ARG."
|
||||
exit 1
|
||||
@@ -38,6 +46,10 @@ for ARG in "$@"; do
|
||||
esac
|
||||
done
|
||||
|
||||
VERSION="${VERSION_PREFIX}${VERSION_SUFFIX}"
|
||||
ROUTER_VERSION="${ROUTER_VERSION_PREFIX}${VERSION_SUFFIX}"
|
||||
echo "====== BUILDING: Version ${VERSION} (Router ${ROUTER_VERSION})"
|
||||
|
||||
export NODE_PATH=${NODE_PATH}:$(pwd)/dist/all:$(pwd)/dist/tools
|
||||
TSC="node --max-old-space-size=3000 dist/tools/@angular/tsc-wrapped/src/main"
|
||||
UGLIFYJS=`pwd`/node_modules/.bin/uglifyjs
|
||||
@@ -197,9 +209,24 @@ do
|
||||
$UGLIFYJS -c --screw-ie8 --comments -o ${UMD_UPGRADE_ES5_MIN_PATH} ${UMD_UPGRADE_ES5_PATH}
|
||||
fi
|
||||
) 2>&1 | grep -v "as external dependency"
|
||||
|
||||
fi
|
||||
|
||||
(
|
||||
echo "====== VERSION: Updating version references"
|
||||
cd ${DESTDIR}
|
||||
echo "====== EXECUTE: perl -p -i -e \"s/0\.0\.0\-PLACEHOLDER/${VERSION}/g\" $""(grep -ril 0\.0\.0\-PLACEHOLDER .)"
|
||||
perl -p -i -e "s/0\.0\.0\-PLACEHOLDER/${VERSION}/g" $(grep -ril 0\.0\.0\-PLACEHOLDER .) < /dev/null 2> /dev/null
|
||||
echo "====== EXECUTE: perl -p -i -e \"s/0\.0\.0\-ROUTERPLACEHOLDER/${ROUTER_VERSION}/g\" $""(grep -ril 0\.0\.0\-ROUTERPLACEHOLDER .)"
|
||||
perl -p -i -e "s/0\.0\.0\-ROUTERPLACEHOLDER/${ROUTER_VERSION}/g" $(grep -ril 0\.0\.0\-ROUTERPLACEHOLDER .) < /dev/null 2> /dev/null
|
||||
)
|
||||
done
|
||||
|
||||
echo ""
|
||||
echo "====== Building examples: ./modules/@angular/examples/build.sh ====="
|
||||
./modules/@angular/examples/build.sh
|
||||
|
||||
if [[ ${REMOVE_BENCHPRESS} == true ]]; then
|
||||
echo ""
|
||||
echo "==== Removing benchpress from publication"
|
||||
rm -r dist/packages-dist/benchpress
|
||||
fi
|
||||
|
||||
+1
-1
@@ -4,7 +4,7 @@ machine:
|
||||
|
||||
dependencies:
|
||||
pre:
|
||||
- npm install -g npm
|
||||
- npm install -g npm@3.6.0
|
||||
|
||||
test:
|
||||
override:
|
||||
|
||||
@@ -44,7 +44,7 @@ const DATE_FORMATS_SPLIT =
|
||||
/((?:[^yMLdHhmsazZEwGjJ']+)|(?:'(?:[^']|'')*')|(?:E+|y+|M+|L+|d+|H+|h+|J+|j+|m+|s+|a|z|Z|G+|w+))(.*)/;
|
||||
|
||||
const PATTERN_ALIASES: {[format: string]: DateFormatterFn} = {
|
||||
yMMMdjms: datePartGetterFactory(combine([
|
||||
'yMMMdjms': datePartGetterFactory(combine([
|
||||
digitCondition('year', 1),
|
||||
nameCondition('month', 3),
|
||||
digitCondition('day', 1),
|
||||
@@ -52,23 +52,23 @@ const PATTERN_ALIASES: {[format: string]: DateFormatterFn} = {
|
||||
digitCondition('minute', 1),
|
||||
digitCondition('second', 1),
|
||||
])),
|
||||
yMdjm: datePartGetterFactory(combine([
|
||||
'yMdjm': datePartGetterFactory(combine([
|
||||
digitCondition('year', 1), digitCondition('month', 1), digitCondition('day', 1),
|
||||
digitCondition('hour', 1), digitCondition('minute', 1)
|
||||
])),
|
||||
yMMMMEEEEd: datePartGetterFactory(combine([
|
||||
'yMMMMEEEEd': datePartGetterFactory(combine([
|
||||
digitCondition('year', 1), nameCondition('month', 4), nameCondition('weekday', 4),
|
||||
digitCondition('day', 1)
|
||||
])),
|
||||
yMMMMd: datePartGetterFactory(
|
||||
'yMMMMd': datePartGetterFactory(
|
||||
combine([digitCondition('year', 1), nameCondition('month', 4), digitCondition('day', 1)])),
|
||||
yMMMd: datePartGetterFactory(
|
||||
'yMMMd': datePartGetterFactory(
|
||||
combine([digitCondition('year', 1), nameCondition('month', 3), digitCondition('day', 1)])),
|
||||
yMd: datePartGetterFactory(
|
||||
'yMd': datePartGetterFactory(
|
||||
combine([digitCondition('year', 1), digitCondition('month', 1), digitCondition('day', 1)])),
|
||||
jms: datePartGetterFactory(combine(
|
||||
'jms': datePartGetterFactory(combine(
|
||||
[digitCondition('hour', 1), digitCondition('second', 1), digitCondition('minute', 1)])),
|
||||
jm: datePartGetterFactory(combine([digitCondition('hour', 1), digitCondition('minute', 1)]))
|
||||
'jm': datePartGetterFactory(combine([digitCondition('hour', 1), digitCondition('minute', 1)]))
|
||||
};
|
||||
|
||||
const DATE_FORMATS: {[format: string]: DateFormatterFn} = {
|
||||
|
||||
@@ -20,8 +20,8 @@ import {EmptyError} from 'rxjs/util/EmptyError';
|
||||
|
||||
import {Route, Routes, UrlMatchResult} from './config';
|
||||
import {LoadedRouterConfig, RouterConfigLoader} from './router_config_loader';
|
||||
import {NavigationCancelingError, PRIMARY_OUTLET, defaultUrlMatcher} from './shared';
|
||||
import {UrlSegment, UrlSegmentGroup, UrlTree} from './url_tree';
|
||||
import {NavigationCancelingError, PRIMARY_OUTLET, Params, defaultUrlMatcher} from './shared';
|
||||
import {UrlSegment, UrlSegmentGroup, UrlSerializer, UrlTree} from './url_tree';
|
||||
import {andObservables, forEach, merge, waitForMap, wrapIntoObservable} from './utils/collection';
|
||||
|
||||
class NoMatch {
|
||||
@@ -29,7 +29,7 @@ class NoMatch {
|
||||
}
|
||||
|
||||
class AbsoluteRedirect {
|
||||
constructor(public segments: UrlSegment[]) {}
|
||||
constructor(public urlTree: UrlTree) {}
|
||||
}
|
||||
|
||||
function noMatch(segmentGroup: UrlSegmentGroup): Observable<UrlSegmentGroup> {
|
||||
@@ -37,9 +37,15 @@ function noMatch(segmentGroup: UrlSegmentGroup): Observable<UrlSegmentGroup> {
|
||||
(obs: Observer<UrlSegmentGroup>) => obs.error(new NoMatch(segmentGroup)));
|
||||
}
|
||||
|
||||
function absoluteRedirect(segments: UrlSegment[]): Observable<UrlSegmentGroup> {
|
||||
function absoluteRedirect(newTree: UrlTree): Observable<any> {
|
||||
return new Observable<UrlSegmentGroup>(
|
||||
(obs: Observer<UrlSegmentGroup>) => obs.error(new AbsoluteRedirect(segments)));
|
||||
(obs: Observer<UrlSegmentGroup>) => obs.error(new AbsoluteRedirect(newTree)));
|
||||
}
|
||||
|
||||
function namedOutletsRedirect(redirectTo: string): Observable<any> {
|
||||
return new Observable<UrlSegmentGroup>(
|
||||
(obs: Observer<UrlSegmentGroup>) => obs.error(new Error(
|
||||
`Only absolute redirects can have named outlets. redirectTo: '${redirectTo}'`)));
|
||||
}
|
||||
|
||||
function canLoadFails(route: Route): Observable<LoadedRouterConfig> {
|
||||
@@ -50,9 +56,9 @@ function canLoadFails(route: Route): Observable<LoadedRouterConfig> {
|
||||
|
||||
|
||||
export function applyRedirects(
|
||||
injector: Injector, configLoader: RouterConfigLoader, urlTree: UrlTree,
|
||||
config: Routes): Observable<UrlTree> {
|
||||
return new ApplyRedirects(injector, configLoader, urlTree, config).apply();
|
||||
injector: Injector, configLoader: RouterConfigLoader, urlSerializer: UrlSerializer,
|
||||
urlTree: UrlTree, config: Routes): Observable<UrlTree> {
|
||||
return new ApplyRedirects(injector, configLoader, urlSerializer, urlTree, config).apply();
|
||||
}
|
||||
|
||||
class ApplyRedirects {
|
||||
@@ -60,21 +66,20 @@ class ApplyRedirects {
|
||||
|
||||
constructor(
|
||||
private injector: Injector, private configLoader: RouterConfigLoader,
|
||||
private urlTree: UrlTree, private config: Routes) {}
|
||||
private urlSerializer: UrlSerializer, private urlTree: UrlTree, private config: Routes) {}
|
||||
|
||||
apply(): Observable<UrlTree> {
|
||||
const expanded$ =
|
||||
this.expandSegmentGroup(this.injector, this.config, this.urlTree.root, PRIMARY_OUTLET);
|
||||
const urlTrees$ = map.call(
|
||||
expanded$, (rootSegmentGroup: UrlSegmentGroup) => this.createUrlTree(rootSegmentGroup));
|
||||
expanded$, (rootSegmentGroup: UrlSegmentGroup) => this.createUrlTree(
|
||||
rootSegmentGroup, this.urlTree.queryParams, this.urlTree.fragment));
|
||||
return _catch.call(urlTrees$, (e: any) => {
|
||||
if (e instanceof AbsoluteRedirect) {
|
||||
// after an absolute redirect we do not apply any more redirects!
|
||||
this.allowRedirects = false;
|
||||
const group =
|
||||
new UrlSegmentGroup([], {[PRIMARY_OUTLET]: new UrlSegmentGroup(e.segments, {})});
|
||||
// we need to run matching, so we can fetch all lazy-loaded modules
|
||||
return this.match(group);
|
||||
return this.match(e.urlTree);
|
||||
} else if (e instanceof NoMatch) {
|
||||
throw this.noMatchError(e);
|
||||
} else {
|
||||
@@ -83,11 +88,12 @@ class ApplyRedirects {
|
||||
});
|
||||
}
|
||||
|
||||
private match(segmentGroup: UrlSegmentGroup): Observable<UrlTree> {
|
||||
private match(tree: UrlTree): Observable<UrlTree> {
|
||||
const expanded$ =
|
||||
this.expandSegmentGroup(this.injector, this.config, segmentGroup, PRIMARY_OUTLET);
|
||||
this.expandSegmentGroup(this.injector, this.config, tree.root, PRIMARY_OUTLET);
|
||||
const mapped$ = map.call(
|
||||
expanded$, (rootSegmentGroup: UrlSegmentGroup) => this.createUrlTree(rootSegmentGroup));
|
||||
expanded$, (rootSegmentGroup: UrlSegmentGroup) =>
|
||||
this.createUrlTree(rootSegmentGroup, tree.queryParams, tree.fragment));
|
||||
return _catch.call(mapped$, (e: any): Observable<UrlTree> => {
|
||||
if (e instanceof NoMatch) {
|
||||
throw this.noMatchError(e);
|
||||
@@ -101,11 +107,12 @@ class ApplyRedirects {
|
||||
return new Error(`Cannot match any routes. URL Segment: '${e.segmentGroup}'`);
|
||||
}
|
||||
|
||||
private createUrlTree(rootCandidate: UrlSegmentGroup): UrlTree {
|
||||
private createUrlTree(rootCandidate: UrlSegmentGroup, queryParams: Params, fragment: string):
|
||||
UrlTree {
|
||||
const root = rootCandidate.segments.length > 0 ?
|
||||
new UrlSegmentGroup([], {[PRIMARY_OUTLET]: rootCandidate}) :
|
||||
rootCandidate;
|
||||
return new UrlTree(root, this.urlTree.queryParams, this.urlTree.fragment);
|
||||
return new UrlTree(root, queryParams, fragment);
|
||||
}
|
||||
|
||||
private expandSegmentGroup(
|
||||
@@ -191,12 +198,14 @@ class ApplyRedirects {
|
||||
private expandWildCardWithParamsAgainstRouteUsingRedirect(
|
||||
injector: Injector, routes: Route[], route: Route,
|
||||
outlet: string): Observable<UrlSegmentGroup> {
|
||||
const newSegments = applyRedirectCommands([], route.redirectTo, {});
|
||||
const newTree = this.applyRedirectCommands([], route.redirectTo, {});
|
||||
if (route.redirectTo.startsWith('/')) {
|
||||
return absoluteRedirect(newSegments);
|
||||
return absoluteRedirect(newTree);
|
||||
} else {
|
||||
const group = new UrlSegmentGroup(newSegments, {});
|
||||
return this.expandSegment(injector, group, routes, newSegments, outlet, false);
|
||||
return mergeMap.call(this.lineralizeSegments(route, newTree), (newSegments: UrlSegment[]) => {
|
||||
const group = new UrlSegmentGroup(newSegments, {});
|
||||
return this.expandSegment(injector, group, routes, newSegments, outlet, false);
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
@@ -207,14 +216,16 @@ class ApplyRedirects {
|
||||
match(segmentGroup, route, segments);
|
||||
if (!matched) return noMatch(segmentGroup);
|
||||
|
||||
const newSegments =
|
||||
applyRedirectCommands(consumedSegments, route.redirectTo, <any>positionalParamSegments);
|
||||
const newTree = this.applyRedirectCommands(
|
||||
consumedSegments, route.redirectTo, <any>positionalParamSegments);
|
||||
if (route.redirectTo.startsWith('/')) {
|
||||
return absoluteRedirect(newSegments);
|
||||
return absoluteRedirect(newTree);
|
||||
} else {
|
||||
return this.expandSegment(
|
||||
injector, segmentGroup, routes, newSegments.concat(segments.slice(lastChild)), outlet,
|
||||
false);
|
||||
return mergeMap.call(this.lineralizeSegments(route, newTree), (newSegments: UrlSegment[]) => {
|
||||
return this.expandSegment(
|
||||
injector, segmentGroup, routes, newSegments.concat(segments.slice(lastChild)), outlet,
|
||||
false);
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
@@ -284,6 +295,92 @@ class ApplyRedirects {
|
||||
return of (new LoadedRouterConfig([], injector, null, null));
|
||||
}
|
||||
}
|
||||
|
||||
private lineralizeSegments(route: Route, urlTree: UrlTree): Observable<UrlSegment[]> {
|
||||
let res: UrlSegment[] = [];
|
||||
let c = urlTree.root;
|
||||
while (true) {
|
||||
res = res.concat(c.segments);
|
||||
if (c.numberOfChildren === 0) {
|
||||
return of (res);
|
||||
} else if (c.numberOfChildren > 1 || !c.children[PRIMARY_OUTLET]) {
|
||||
return namedOutletsRedirect(route.redirectTo);
|
||||
} else {
|
||||
c = c.children[PRIMARY_OUTLET];
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
private applyRedirectCommands(
|
||||
segments: UrlSegment[], redirectTo: string, posParams: {[k: string]: UrlSegment}): UrlTree {
|
||||
const t = this.urlSerializer.parse(redirectTo);
|
||||
return this.applyRedirectCreatreUrlTree(
|
||||
redirectTo, this.urlSerializer.parse(redirectTo), segments, posParams);
|
||||
}
|
||||
|
||||
private applyRedirectCreatreUrlTree(
|
||||
redirectTo: string, urlTree: UrlTree, segments: UrlSegment[],
|
||||
posParams: {[k: string]: UrlSegment}): UrlTree {
|
||||
const newRoot = this.createSegmentGroup(redirectTo, urlTree.root, segments, posParams);
|
||||
return new UrlTree(
|
||||
newRoot, this.createQueryParams(urlTree.queryParams, this.urlTree.queryParams),
|
||||
urlTree.fragment);
|
||||
}
|
||||
|
||||
private createQueryParams(redirectToParams: Params, actualParams: Params): Params {
|
||||
const res: Params = {};
|
||||
forEach(redirectToParams, (v: any, k: string) => {
|
||||
if (v.startsWith(':')) {
|
||||
res[k] = actualParams[v.substring(1)];
|
||||
} else {
|
||||
res[k] = v;
|
||||
}
|
||||
});
|
||||
return res;
|
||||
}
|
||||
|
||||
private createSegmentGroup(
|
||||
redirectTo: string, group: UrlSegmentGroup, segments: UrlSegment[],
|
||||
posParams: {[k: string]: UrlSegment}): UrlSegmentGroup {
|
||||
const updatedSegments = this.createSegments(redirectTo, group.segments, segments, posParams);
|
||||
|
||||
let children: {[n: string]: UrlSegmentGroup} = {};
|
||||
forEach(group.children, (child: UrlSegmentGroup, name: string) => {
|
||||
children[name] = this.createSegmentGroup(redirectTo, child, segments, posParams);
|
||||
});
|
||||
|
||||
return new UrlSegmentGroup(updatedSegments, children);
|
||||
}
|
||||
|
||||
private createSegments(
|
||||
redirectTo: string, redirectToSegments: UrlSegment[], actualSegments: UrlSegment[],
|
||||
posParams: {[k: string]: UrlSegment}): UrlSegment[] {
|
||||
return redirectToSegments.map(
|
||||
s => s.path.startsWith(':') ? this.findPosParam(redirectTo, s, posParams) :
|
||||
this.findOrReturn(s, actualSegments));
|
||||
}
|
||||
|
||||
private findPosParam(
|
||||
redirectTo: string, redirectToUrlSegment: UrlSegment,
|
||||
posParams: {[k: string]: UrlSegment}): UrlSegment {
|
||||
const pos = posParams[redirectToUrlSegment.path.substring(1)];
|
||||
if (!pos)
|
||||
throw new Error(
|
||||
`Cannot redirect to '${redirectTo}'. Cannot find '${redirectToUrlSegment.path}'.`);
|
||||
return pos;
|
||||
}
|
||||
|
||||
private findOrReturn(redirectToUrlSegment: UrlSegment, actualSegments: UrlSegment[]): UrlSegment {
|
||||
let idx = 0;
|
||||
for (const s of actualSegments) {
|
||||
if (s.path === redirectToUrlSegment.path) {
|
||||
actualSegments.splice(idx);
|
||||
return s;
|
||||
}
|
||||
idx++;
|
||||
}
|
||||
return redirectToUrlSegment;
|
||||
}
|
||||
}
|
||||
|
||||
function runGuards(injector: Injector, route: Route): Observable<boolean> {
|
||||
@@ -328,46 +425,6 @@ function match(segmentGroup: UrlSegmentGroup, route: Route, segments: UrlSegment
|
||||
};
|
||||
}
|
||||
|
||||
function applyRedirectCommands(
|
||||
segments: UrlSegment[], redirectTo: string,
|
||||
posParams: {[k: string]: UrlSegment}): UrlSegment[] {
|
||||
const r = redirectTo.startsWith('/') ? redirectTo.substring(1) : redirectTo;
|
||||
if (r === '') {
|
||||
return [];
|
||||
} else {
|
||||
return createSegments(redirectTo, r.split('/'), segments, posParams);
|
||||
}
|
||||
}
|
||||
|
||||
function createSegments(
|
||||
redirectTo: string, parts: string[], segments: UrlSegment[],
|
||||
posParams: {[k: string]: UrlSegment}): UrlSegment[] {
|
||||
return parts.map(
|
||||
p => p.startsWith(':') ? findPosParam(p, posParams, redirectTo) :
|
||||
findOrCreateSegment(p, segments));
|
||||
}
|
||||
|
||||
function findPosParam(
|
||||
part: string, posParams: {[k: string]: UrlSegment}, redirectTo: string): UrlSegment {
|
||||
const paramName = part.substring(1);
|
||||
const pos = posParams[paramName];
|
||||
if (!pos) throw new Error(`Cannot redirect to '${redirectTo}'. Cannot find '${part}'.`);
|
||||
return pos;
|
||||
}
|
||||
|
||||
function findOrCreateSegment(part: string, segments: UrlSegment[]): UrlSegment {
|
||||
let idx = 0;
|
||||
for (const s of segments) {
|
||||
if (s.path === part) {
|
||||
segments.splice(idx);
|
||||
return s;
|
||||
}
|
||||
idx++;
|
||||
}
|
||||
return new UrlSegment(part, {});
|
||||
}
|
||||
|
||||
|
||||
function split(
|
||||
segmentGroup: UrlSegmentGroup, consumedSegments: UrlSegment[], slicedSegments: UrlSegment[],
|
||||
config: Route[]) {
|
||||
|
||||
@@ -650,7 +650,7 @@ export class Router {
|
||||
let urlAndSnapshot$: Observable<{appliedUrl: UrlTree, snapshot: RouterStateSnapshot}>;
|
||||
if (!precreatedState) {
|
||||
const redirectsApplied$ =
|
||||
applyRedirects(this.injector, this.configLoader, url, this.config);
|
||||
applyRedirects(this.injector, this.configLoader, this.urlSerializer, url, this.config);
|
||||
|
||||
urlAndSnapshot$ = mergeMap.call(redirectsApplied$, (appliedUrl: UrlTree) => {
|
||||
return map.call(
|
||||
|
||||
@@ -15,6 +15,7 @@ import {LoadedRouterConfig} from '../src/router_config_loader';
|
||||
import {DefaultUrlSerializer, UrlSegmentGroup, UrlTree, equalSegments} from '../src/url_tree';
|
||||
|
||||
describe('applyRedirects', () => {
|
||||
const serializer = new DefaultUrlSerializer();
|
||||
|
||||
it('should return the same url tree when no redirects', () => {
|
||||
checkRedirect(
|
||||
@@ -38,7 +39,7 @@ describe('applyRedirects', () => {
|
||||
});
|
||||
|
||||
it('should throw when cannot handle a positional parameter', () => {
|
||||
applyRedirects(null, null, tree('/a/1'), [
|
||||
applyRedirects(null, null, serializer, tree('/a/1'), [
|
||||
{path: 'a/:id', redirectTo: 'a/:other'}
|
||||
]).subscribe(() => {}, (e) => {
|
||||
expect(e.message).toEqual('Cannot redirect to \'a/:other\'. Cannot find \':other\'.');
|
||||
@@ -133,11 +134,11 @@ describe('applyRedirects', () => {
|
||||
{
|
||||
path: 'a',
|
||||
component: ComponentA,
|
||||
children: [{path: 'b/:id', redirectTo: '/absolute/:id'}]
|
||||
children: [{path: 'b/:id', redirectTo: '/absolute/:id?a=1&b=:b#f1'}]
|
||||
},
|
||||
{path: '**', component: ComponentC}
|
||||
],
|
||||
'/a/b/1', (t: UrlTree) => { compareTrees(t, tree('/absolute/1')); });
|
||||
'/a/b/1?b=2', (t: UrlTree) => { compareTrees(t, tree('/absolute/1?a=1&b=2#f1')); });
|
||||
});
|
||||
|
||||
describe('lazy loading', () => {
|
||||
@@ -153,10 +154,11 @@ describe('applyRedirects', () => {
|
||||
};
|
||||
const config = [{path: 'a', component: ComponentA, loadChildren: 'children'}];
|
||||
|
||||
applyRedirects(<any>'providedInjector', <any>loader, tree('a/b'), config).forEach(r => {
|
||||
compareTrees(r, tree('/a/b'));
|
||||
expect((<any>config[0])._loadedConfig).toBe(loadedConfig);
|
||||
});
|
||||
applyRedirects(<any>'providedInjector', <any>loader, serializer, tree('a/b'), config)
|
||||
.forEach(r => {
|
||||
compareTrees(r, tree('/a/b'));
|
||||
expect((<any>config[0])._loadedConfig).toBe(loadedConfig);
|
||||
});
|
||||
});
|
||||
|
||||
it('should handle the case when the loader errors', () => {
|
||||
@@ -165,9 +167,8 @@ describe('applyRedirects', () => {
|
||||
};
|
||||
const config = [{path: 'a', component: ComponentA, loadChildren: 'children'}];
|
||||
|
||||
applyRedirects(null, <any>loader, tree('a/b'), config).subscribe(() => {}, (e) => {
|
||||
expect(e.message).toEqual('Loading Error');
|
||||
});
|
||||
applyRedirects(null, <any>loader, serializer, tree('a/b'), config)
|
||||
.subscribe(() => {}, (e) => { expect(e.message).toEqual('Loading Error'); });
|
||||
});
|
||||
|
||||
it('should load when all canLoad guards return true', () => {
|
||||
@@ -186,7 +187,7 @@ describe('applyRedirects', () => {
|
||||
loadChildren: 'children'
|
||||
}];
|
||||
|
||||
applyRedirects(<any>injector, <any>loader, tree('a/b'), config).forEach(r => {
|
||||
applyRedirects(<any>injector, <any>loader, serializer, tree('a/b'), config).forEach(r => {
|
||||
compareTrees(r, tree('/a/b'));
|
||||
});
|
||||
});
|
||||
@@ -208,7 +209,7 @@ describe('applyRedirects', () => {
|
||||
loadChildren: 'children'
|
||||
}];
|
||||
|
||||
applyRedirects(<any>injector, <any>loader, tree('a/b'), config)
|
||||
applyRedirects(<any>injector, <any>loader, serializer, tree('a/b'), config)
|
||||
.subscribe(
|
||||
() => { throw 'Should not reach'; },
|
||||
(e) => {
|
||||
@@ -234,7 +235,7 @@ describe('applyRedirects', () => {
|
||||
loadChildren: 'children'
|
||||
}];
|
||||
|
||||
applyRedirects(<any>injector, <any>loader, tree('a/b'), config)
|
||||
applyRedirects(<any>injector, <any>loader, serializer, tree('a/b'), config)
|
||||
.subscribe(
|
||||
() => { throw 'Should not reach'; }, (e) => { expect(e).toEqual('someError'); });
|
||||
});
|
||||
@@ -251,7 +252,7 @@ describe('applyRedirects', () => {
|
||||
const config =
|
||||
[{path: 'a', component: ComponentA, canLoad: ['guard'], loadChildren: 'children'}];
|
||||
|
||||
applyRedirects(<any>injector, <any>loader, tree('a/b'), config)
|
||||
applyRedirects(<any>injector, <any>loader, serializer, tree('a/b'), config)
|
||||
.subscribe(
|
||||
(r) => { compareTrees(r, tree('/a/b')); }, (e) => { throw 'Should not reach'; });
|
||||
|
||||
@@ -267,10 +268,11 @@ describe('applyRedirects', () => {
|
||||
const config =
|
||||
[{path: '', pathMatch: 'full', redirectTo: '/a'}, {path: 'a', loadChildren: 'children'}];
|
||||
|
||||
applyRedirects(<any>'providedInjector', <any>loader, tree(''), config).forEach(r => {
|
||||
compareTrees(r, tree('a'));
|
||||
expect((<any>config[1])._loadedConfig).toBe(loadedConfig);
|
||||
});
|
||||
applyRedirects(<any>'providedInjector', <any>loader, serializer, tree(''), config)
|
||||
.forEach(r => {
|
||||
compareTrees(r, tree('a'));
|
||||
expect((<any>config[1])._loadedConfig).toBe(loadedConfig);
|
||||
});
|
||||
});
|
||||
|
||||
it('should load the configuration only once', () => {
|
||||
@@ -289,12 +291,13 @@ describe('applyRedirects', () => {
|
||||
|
||||
const config = [{path: 'a', loadChildren: 'children'}];
|
||||
|
||||
applyRedirects(<any>'providedInjector', <any>loader, tree('a?k1'), config).subscribe(r => {});
|
||||
applyRedirects(<any>'providedInjector', <any>loader, serializer, tree('a?k1'), config)
|
||||
.subscribe(r => {});
|
||||
|
||||
applyRedirects(<any>'providedInjector', <any>loader, tree('a?k2'), config)
|
||||
applyRedirects(<any>'providedInjector', <any>loader, serializer, tree('a?k2'), config)
|
||||
.subscribe(
|
||||
r => {
|
||||
compareTrees(r, tree('a'));
|
||||
compareTrees(r, tree('a?k2'));
|
||||
expect((<any>config[0])._loadedConfig).toBe(loadedConfig);
|
||||
},
|
||||
(e) => { throw 'Should not reach'; });
|
||||
@@ -309,9 +312,8 @@ describe('applyRedirects', () => {
|
||||
|
||||
const config = [{path: '**', loadChildren: 'children'}];
|
||||
|
||||
applyRedirects(<any>'providedInjector', <any>loader, tree('xyz'), config).forEach(r => {
|
||||
expect((<any>config[0])._loadedConfig).toBe(loadedConfig);
|
||||
});
|
||||
applyRedirects(<any>'providedInjector', <any>loader, serializer, tree('xyz'), config)
|
||||
.forEach(r => { expect((<any>config[0])._loadedConfig).toBe(loadedConfig); });
|
||||
});
|
||||
|
||||
it('should load the configuration after a local redirect from a wildcard route', () => {
|
||||
@@ -324,9 +326,8 @@ describe('applyRedirects', () => {
|
||||
const config =
|
||||
[{path: 'not-found', loadChildren: 'children'}, {path: '**', redirectTo: 'not-found'}];
|
||||
|
||||
applyRedirects(<any>'providedInjector', <any>loader, tree('xyz'), config).forEach(r => {
|
||||
expect((<any>config[0])._loadedConfig).toBe(loadedConfig);
|
||||
});
|
||||
applyRedirects(<any>'providedInjector', <any>loader, serializer, tree('xyz'), config)
|
||||
.forEach(r => { expect((<any>config[0])._loadedConfig).toBe(loadedConfig); });
|
||||
});
|
||||
|
||||
it('should load the configuration after an absolute redirect from a wildcard route', () => {
|
||||
@@ -339,9 +340,8 @@ describe('applyRedirects', () => {
|
||||
const config =
|
||||
[{path: 'not-found', loadChildren: 'children'}, {path: '**', redirectTo: '/not-found'}];
|
||||
|
||||
applyRedirects(<any>'providedInjector', <any>loader, tree('xyz'), config).forEach(r => {
|
||||
expect((<any>config[0])._loadedConfig).toBe(loadedConfig);
|
||||
});
|
||||
applyRedirects(<any>'providedInjector', <any>loader, serializer, tree('xyz'), config)
|
||||
.forEach(r => { expect((<any>config[0])._loadedConfig).toBe(loadedConfig); });
|
||||
});
|
||||
});
|
||||
|
||||
@@ -388,7 +388,7 @@ describe('applyRedirects', () => {
|
||||
{path: '', redirectTo: 'a', pathMatch: 'full'}
|
||||
];
|
||||
|
||||
applyRedirects(null, null, tree('b'), config)
|
||||
applyRedirects(null, null, serializer, tree('b'), config)
|
||||
.subscribe(
|
||||
(_) => { throw 'Should not be reached'; },
|
||||
e => { expect(e.message).toEqual('Cannot match any routes. URL Segment: \'b\''); });
|
||||
@@ -518,7 +518,7 @@ describe('applyRedirects', () => {
|
||||
]
|
||||
}];
|
||||
|
||||
applyRedirects(null, null, tree('a/(d//aux:e)'), config)
|
||||
applyRedirects(null, null, serializer, tree('a/(d//aux:e)'), config)
|
||||
.subscribe(
|
||||
(_) => { throw 'Should not be reached'; },
|
||||
e => { expect(e.message).toEqual('Cannot match any routes. URL Segment: \'a\''); });
|
||||
@@ -549,7 +549,7 @@ describe('applyRedirects', () => {
|
||||
|
||||
it('should error when no children matching and some url is left', () => {
|
||||
applyRedirects(
|
||||
null, null, tree('/a/c'),
|
||||
null, null, serializer, tree('/a/c'),
|
||||
[{path: 'a', component: ComponentA, children: [{path: 'b', component: ComponentB}]}])
|
||||
.subscribe(
|
||||
(_) => { throw 'Should not be reached'; },
|
||||
@@ -576,10 +576,46 @@ describe('applyRedirects', () => {
|
||||
'/a/1/b', (t: UrlTree) => { compareTrees(t, tree('a/1/b')); });
|
||||
});
|
||||
});
|
||||
|
||||
describe('redirecting to named outlets', () => {
|
||||
it('should work when using absolute redirects', () => {
|
||||
checkRedirect(
|
||||
[
|
||||
{path: 'a/:id', redirectTo: '/b/:id(aux:c/:id)'},
|
||||
{path: 'b/:id', component: ComponentB},
|
||||
{path: 'c/:id', component: ComponentC, outlet: 'aux'}
|
||||
],
|
||||
'a/1;p=99', (t: UrlTree) => { compareTrees(t, tree('/b/1;p=99(aux:c/1;p=99)')); });
|
||||
});
|
||||
|
||||
it('should work when using absolute redirects (wildcard)', () => {
|
||||
checkRedirect(
|
||||
[
|
||||
{path: '**', redirectTo: '/b(aux:c)'}, {path: 'b', component: ComponentB},
|
||||
{path: 'c', component: ComponentC, outlet: 'aux'}
|
||||
],
|
||||
'a/1', (t: UrlTree) => { compareTrees(t, tree('/b(aux:c)')); });
|
||||
});
|
||||
|
||||
it('should throw when using non-absolute redirects', () => {
|
||||
applyRedirects(
|
||||
null, null, serializer, tree('a'),
|
||||
[
|
||||
{path: 'a', redirectTo: 'b(aux:c)'},
|
||||
])
|
||||
.subscribe(
|
||||
() => { throw new Error('should not be reached'); },
|
||||
(e) => {
|
||||
expect(e.message).toEqual(
|
||||
'Only absolute redirects can have named outlets. redirectTo: \'b(aux:c)\'');
|
||||
});
|
||||
});
|
||||
});
|
||||
});
|
||||
|
||||
function checkRedirect(config: Routes, url: string, callback: any): void {
|
||||
applyRedirects(null, null, tree(url), config).subscribe(callback, e => { throw e; });
|
||||
applyRedirects(null, null, new DefaultUrlSerializer(), tree(url), config)
|
||||
.subscribe(callback, e => { throw e; });
|
||||
}
|
||||
|
||||
function tree(url: string): UrlTree {
|
||||
@@ -591,6 +627,8 @@ function compareTrees(actual: UrlTree, expected: UrlTree): void {
|
||||
const error =
|
||||
`"${serializer.serialize(actual)}" is not equal to "${serializer.serialize(expected)}"`;
|
||||
compareSegments(actual.root, expected.root, error);
|
||||
expect(actual.queryParams).toEqual(expected.queryParams);
|
||||
expect(actual.fragment).toEqual(expected.fragment);
|
||||
}
|
||||
|
||||
function compareSegments(actual: UrlSegmentGroup, expected: UrlSegmentGroup, error: string): void {
|
||||
|
||||
@@ -166,16 +166,14 @@ export class UpgradeModule {
|
||||
(testabilityDelegate: angular.ITestabilityService) => {
|
||||
const originalWhenStable: Function = testabilityDelegate.whenStable;
|
||||
const injector = this.injector;
|
||||
// Cannot use arrow function below because we need to grab the context
|
||||
// Cannot use arrow function below because we need the context
|
||||
const newWhenStable = function(callback: Function) {
|
||||
const whenStableContext: any = this;
|
||||
originalWhenStable.call(this, function() {
|
||||
const ng2Testability: Testability = injector.get(Testability);
|
||||
if (ng2Testability.isStable()) {
|
||||
callback.apply(this, arguments);
|
||||
} else {
|
||||
ng2Testability.whenStable(
|
||||
newWhenStable.bind(whenStableContext, callback));
|
||||
ng2Testability.whenStable(newWhenStable.bind(this, callback));
|
||||
}
|
||||
});
|
||||
};
|
||||
|
||||
@@ -355,14 +355,14 @@ export class UpgradeAdapter {
|
||||
function(testabilityDelegate: angular.ITestabilityService) {
|
||||
|
||||
const originalWhenStable: Function = testabilityDelegate.whenStable;
|
||||
const newWhenStable = (callback: Function): void => {
|
||||
const whenStableContext: any = this;
|
||||
// Cannot use arrow function below because we need the context
|
||||
const newWhenStable = function(callback: Function) {
|
||||
originalWhenStable.call(this, function() {
|
||||
const ng2Testability: Testability = moduleRef.injector.get(Testability);
|
||||
if (ng2Testability.isStable()) {
|
||||
callback.apply(this, arguments);
|
||||
} else {
|
||||
ng2Testability.whenStable(newWhenStable.bind(whenStableContext, callback));
|
||||
ng2Testability.whenStable(newWhenStable.bind(this, callback));
|
||||
}
|
||||
});
|
||||
};
|
||||
@@ -433,8 +433,9 @@ export class UpgradeAdapter {
|
||||
if (windowAngular.resumeBootstrap) {
|
||||
const originalResumeBootstrap: () => void = windowAngular.resumeBootstrap;
|
||||
windowAngular.resumeBootstrap = function() {
|
||||
let args = arguments;
|
||||
windowAngular.resumeBootstrap = originalResumeBootstrap;
|
||||
windowAngular.resumeBootstrap.apply(this, arguments);
|
||||
ngZone.run(() => { windowAngular.resumeBootstrap.apply(this, args); });
|
||||
resolve();
|
||||
};
|
||||
} else {
|
||||
|
||||
@@ -49,7 +49,8 @@ export class UpgradeNg1ComponentAdapterBuilder {
|
||||
],
|
||||
ngOnInit: function() { /* needs to be here for ng2 to properly detect it */ },
|
||||
ngOnChanges: function() { /* needs to be here for ng2 to properly detect it */ },
|
||||
ngDoCheck: function() { /* needs to be here for ng2 to properly detect it */ }
|
||||
ngDoCheck: function() { /* needs to be here for ng2 to properly detect it */ },
|
||||
ngOnDestroy: function() { /* needs to be here for ng2 to properly detect it */ },
|
||||
});
|
||||
}
|
||||
|
||||
@@ -262,16 +263,18 @@ class UpgradeNg1ComponentAdapter implements OnInit, OnChanges, DoCheck {
|
||||
}
|
||||
|
||||
ngOnChanges(changes: SimpleChanges) {
|
||||
for (const name in changes) {
|
||||
if ((<Object>changes).hasOwnProperty(name)) {
|
||||
const change: SimpleChange = changes[name];
|
||||
this.setComponentProperty(name, change.currentValue);
|
||||
}
|
||||
const ng1Changes: any = {};
|
||||
Object.keys(changes).forEach(name => {
|
||||
const change: SimpleChange = changes[name];
|
||||
this.setComponentProperty(name, change.currentValue);
|
||||
ng1Changes[this.propertyMap[name]] = change;
|
||||
});
|
||||
if (this.destinationObj.$onChanges) {
|
||||
this.destinationObj.$onChanges(ng1Changes);
|
||||
}
|
||||
}
|
||||
|
||||
ngDoCheck(): number {
|
||||
const count = 0;
|
||||
ngDoCheck() {
|
||||
const destinationObj = this.destinationObj;
|
||||
const lastValues = this.checkLastValues;
|
||||
const checkProperties = this.checkProperties;
|
||||
@@ -287,7 +290,15 @@ class UpgradeNg1ComponentAdapter implements OnInit, OnChanges, DoCheck {
|
||||
}
|
||||
}
|
||||
}
|
||||
return count;
|
||||
if (this.destinationObj.$doCheck && this.directive.controller) {
|
||||
this.destinationObj.$doCheck();
|
||||
}
|
||||
}
|
||||
|
||||
ngOnDestroy() {
|
||||
if (this.destinationObj.$onDestroy && this.directive.controller) {
|
||||
this.destinationObj.$onDestroy();
|
||||
}
|
||||
}
|
||||
|
||||
setComponentProperty(name: string, value: any) {
|
||||
|
||||
@@ -922,6 +922,127 @@ export function main() {
|
||||
});
|
||||
}));
|
||||
|
||||
it('should call $doCheck of components', async(() => {
|
||||
const adapter: UpgradeAdapter = new UpgradeAdapter(forwardRef(() => Ng2Module));
|
||||
const ng1Module = angular.module('ng1', []);
|
||||
const valueToFind = '$doCheck';
|
||||
|
||||
let spy = jasmine.createSpy('doCheck');
|
||||
|
||||
const ng1 = {
|
||||
bindings: {},
|
||||
template: '{{$ctrl.value}}',
|
||||
controller: Class({
|
||||
constructor: function() {},
|
||||
$doCheck: function() {
|
||||
this.value = valueToFind;
|
||||
spy();
|
||||
}
|
||||
})
|
||||
};
|
||||
ng1Module.component('ng1', ng1);
|
||||
|
||||
const Ng2 = Component({selector: 'ng2', template: '<ng1></ng1>'}).Class({
|
||||
constructor: function() {}
|
||||
});
|
||||
|
||||
const Ng2Module = NgModule({
|
||||
declarations: [adapter.upgradeNg1Component('ng1'), Ng2],
|
||||
imports: [BrowserModule],
|
||||
schemas: [NO_ERRORS_SCHEMA],
|
||||
}).Class({constructor: function() {}});
|
||||
|
||||
ng1Module.directive('ng2', adapter.downgradeNg2Component(Ng2));
|
||||
|
||||
const element = html(`<div><ng2></ng2></div>`);
|
||||
adapter.bootstrap(element, ['ng1']).ready((ref) => {
|
||||
expect(multiTrim(document.body.textContent)).toEqual(valueToFind);
|
||||
expect(spy).toHaveBeenCalled();
|
||||
let count = spy.calls.count();
|
||||
setTimeout(() => {
|
||||
expect(spy.calls.count()).toBeGreaterThan(count);
|
||||
ref.dispose();
|
||||
}, 100);
|
||||
});
|
||||
}));
|
||||
|
||||
it('should call $onChanges of components', async(() => {
|
||||
const adapter: UpgradeAdapter = new UpgradeAdapter(forwardRef(() => Ng2Module));
|
||||
const ng1Module = angular.module('ng1', []);
|
||||
const valueToFind = '$onChanges init';
|
||||
const valueToChange = '$onChanges changed';
|
||||
|
||||
const ng1 = {
|
||||
bindings: {val: '<'},
|
||||
template: '{{$ctrl.value}}',
|
||||
controller: Class({
|
||||
constructor: function() {},
|
||||
$onChanges: function(changes: any) { this.value = changes.val.currentValue; }
|
||||
})
|
||||
};
|
||||
ng1Module.component('ng1', ng1);
|
||||
|
||||
const Ng2 = Component({selector: 'ng2', template: '<ng1 [val]="val"></ng1>'}).Class({
|
||||
constructor: function() { this.val = valueToFind; },
|
||||
ngOnInit: function() { setTimeout(() => { this.val = valueToChange; }, 100); }
|
||||
});
|
||||
|
||||
const Ng2Module = NgModule({
|
||||
declarations: [adapter.upgradeNg1Component('ng1'), Ng2],
|
||||
imports: [BrowserModule],
|
||||
schemas: [NO_ERRORS_SCHEMA],
|
||||
}).Class({constructor: function() {}});
|
||||
|
||||
ng1Module.directive('ng2', adapter.downgradeNg2Component(Ng2));
|
||||
|
||||
const element = html(`<div><ng2></ng2></div>`);
|
||||
adapter.bootstrap(element, ['ng1']).ready((ref) => {
|
||||
expect(multiTrim(document.body.textContent)).toEqual(valueToFind);
|
||||
setTimeout(() => {
|
||||
expect(multiTrim(document.body.textContent)).toEqual(valueToChange);
|
||||
ref.dispose();
|
||||
}, 200);
|
||||
});
|
||||
}));
|
||||
|
||||
it('should call $onDestroy of components', async(() => {
|
||||
const adapter: UpgradeAdapter = new UpgradeAdapter(forwardRef(() => Ng2Module));
|
||||
const ng1Module = angular.module('ng1', []);
|
||||
|
||||
let spy = jasmine.createSpy('$onDestroy');
|
||||
|
||||
const ng1 = {
|
||||
bindings: {},
|
||||
template: '<div>ng1</div>',
|
||||
controller: function($rootScope: any) { this.$onDestroy = function() { spy(); }; }
|
||||
};
|
||||
ng1Module.component('ng1', ng1);
|
||||
|
||||
const Ng2 = Component({selector: 'ng2', template: '<ng1></ng1>'}).Class({
|
||||
constructor: function() {}
|
||||
});
|
||||
|
||||
const Ng2Module = NgModule({
|
||||
declarations: [adapter.upgradeNg1Component('ng1'), Ng2],
|
||||
imports: [BrowserModule],
|
||||
schemas: [NO_ERRORS_SCHEMA],
|
||||
}).Class({constructor: function() {}});
|
||||
|
||||
ng1Module.directive('ng2', adapter.downgradeNg2Component(Ng2));
|
||||
|
||||
const element = html(`<div ng-if="!destroy"><ng2></ng2></div>`);
|
||||
adapter.bootstrap(element, ['ng1']).ready((ref) => {
|
||||
(<any>ref.ng1RootScope).destroy = false;
|
||||
setTimeout(() => {
|
||||
(<any>ref.ng1RootScope).destroy = true;
|
||||
setTimeout(() => {
|
||||
expect(spy).toHaveBeenCalled();
|
||||
ref.dispose();
|
||||
}, 100);
|
||||
}, 100);
|
||||
});
|
||||
}));
|
||||
|
||||
it('should bind input properties (<) of components', async(() => {
|
||||
const adapter: UpgradeAdapter = new UpgradeAdapter(forwardRef(() => Ng2Module));
|
||||
const ng1Module = angular.module('ng1', []);
|
||||
|
||||
@@ -7,15 +7,18 @@
|
||||
*/
|
||||
|
||||
import {Component, Input, NgModule} from '@angular/core';
|
||||
import {BrowserModule} from '@angular/platform-browser';
|
||||
import {BrowserModule, DomSanitizer, SafeStyle} from '@angular/platform-browser';
|
||||
|
||||
import {TableCell, emptyTable} from '../util';
|
||||
|
||||
let trustedEmptyColor: SafeStyle;
|
||||
let trustedGreyColor: SafeStyle;
|
||||
|
||||
@Component({
|
||||
selector: 'largetable',
|
||||
template: `<table><tbody>
|
||||
<tr *ngFor="let row of data; trackBy: trackByIndex">
|
||||
<td *ngFor="let cell of row; trackBy: trackByIndex" [style.backgroundColor]="cell.row % 2 ? '' : 'grey'">
|
||||
<td *ngFor="let cell of row; trackBy: trackByIndex" [style.backgroundColor]="getColor(cell.row)">
|
||||
{{cell.value}}
|
||||
</td>
|
||||
</tr>
|
||||
@@ -26,8 +29,14 @@ export class TableComponent {
|
||||
data: TableCell[][] = emptyTable;
|
||||
|
||||
trackByIndex(index: number, item: any) { return index; }
|
||||
|
||||
getColor(row: number) { return row % 2 ? trustedEmptyColor : trustedGreyColor; }
|
||||
}
|
||||
|
||||
@NgModule({imports: [BrowserModule], bootstrap: [TableComponent], declarations: [TableComponent]})
|
||||
export class AppModule {
|
||||
constructor(sanitizer: DomSanitizer) {
|
||||
trustedEmptyColor = sanitizer.bypassSecurityTrustStyle('');
|
||||
trustedGreyColor = sanitizer.bypassSecurityTrustStyle('grey');
|
||||
}
|
||||
}
|
||||
|
||||
@@ -7,20 +7,28 @@
|
||||
*/
|
||||
|
||||
import {Component, NgModule} from '@angular/core';
|
||||
import {BrowserModule} from '@angular/platform-browser';
|
||||
import {BrowserModule, DomSanitizer, SafeStyle} from '@angular/platform-browser';
|
||||
|
||||
import {TreeNode, emptyTree} from '../util';
|
||||
|
||||
let trustedEmptyColor: SafeStyle;
|
||||
let trustedGreyColor: SafeStyle;
|
||||
|
||||
@Component({
|
||||
selector: 'tree',
|
||||
inputs: ['data'],
|
||||
template:
|
||||
`<span [style.backgroundColor]="data.depth % 2 ? '' : 'grey'"> {{data.value}} </span><tree *ngIf='data.right != null' [data]='data.right'></tree><tree *ngIf='data.left != null' [data]='data.left'></tree>`
|
||||
`<span [style.backgroundColor]="bgColor"> {{data.value}} </span><tree *ngIf='data.right != null' [data]='data.right'></tree><tree *ngIf='data.left != null' [data]='data.left'></tree>`
|
||||
})
|
||||
export class TreeComponent {
|
||||
data: TreeNode = emptyTree;
|
||||
get bgColor() { return this.data.depth % 2 ? trustedEmptyColor : trustedGreyColor; }
|
||||
}
|
||||
|
||||
@NgModule({imports: [BrowserModule], bootstrap: [TreeComponent], declarations: [TreeComponent]})
|
||||
export class AppModule {
|
||||
constructor(sanitizer: DomSanitizer) {
|
||||
trustedEmptyColor = sanitizer.bypassSecurityTrustStyle('');
|
||||
trustedGreyColor = sanitizer.bypassSecurityTrustStyle('grey');
|
||||
}
|
||||
}
|
||||
|
||||
@@ -7,14 +7,16 @@
|
||||
*/
|
||||
|
||||
import {Component, Input, NgModule} from '@angular/core';
|
||||
import {BrowserModule} from '@angular/platform-browser';
|
||||
import {BrowserModule, DomSanitizer, SafeStyle} from '@angular/platform-browser';
|
||||
|
||||
import {TreeNode, emptyTree, maxDepth} from '../util';
|
||||
|
||||
let trustedEmptyColor: SafeStyle;
|
||||
let trustedGreyColor: SafeStyle;
|
||||
|
||||
function createTreeComponent(level: number, isLeaf: boolean) {
|
||||
const nextTreeEl = `tree${level+1}`;
|
||||
let template =
|
||||
`<span [style.backgroundColor]="data.depth % 2 ? '' : 'grey'"> {{data.value}} </span>`;
|
||||
let template = `<span [style.backgroundColor]="bgColor"> {{data.value}} </span>`;
|
||||
if (!isLeaf) {
|
||||
template +=
|
||||
`<${nextTreeEl} [data]='data.right'></${nextTreeEl}><${nextTreeEl} [data]='data.left'></${nextTreeEl}>`;
|
||||
@@ -24,6 +26,7 @@ function createTreeComponent(level: number, isLeaf: boolean) {
|
||||
class TreeComponent {
|
||||
@Input()
|
||||
data: TreeNode;
|
||||
get bgColor() { return this.data.depth % 2 ? trustedEmptyColor : trustedGreyColor; }
|
||||
}
|
||||
|
||||
return TreeComponent;
|
||||
@@ -43,6 +46,10 @@ function createModule(): any {
|
||||
|
||||
@NgModule({imports: [BrowserModule], bootstrap: [RootTreeComponent], declarations: [components]})
|
||||
class AppModule {
|
||||
constructor(sanitizer: DomSanitizer) {
|
||||
trustedEmptyColor = sanitizer.bypassSecurityTrustStyle('');
|
||||
trustedGreyColor = sanitizer.bypassSecurityTrustStyle('grey');
|
||||
}
|
||||
}
|
||||
|
||||
return AppModule;
|
||||
|
||||
+1
-1
@@ -1,6 +1,6 @@
|
||||
{
|
||||
"name": "angular-srcs",
|
||||
"version": "2.2.1",
|
||||
"version": "2.2.3",
|
||||
"private": true,
|
||||
"branchPattern": "2.0.*",
|
||||
"description": "Angular 2 - a web framework for modern web apps",
|
||||
|
||||
Reference in New Issue
Block a user