Compare commits
27 Commits
Author | SHA1 | Date | |
---|---|---|---|
80fe41a88e | |||
af652a7c8b | |||
de36f8a3b9 | |||
b658fa9ea0 | |||
2a123463ac | |||
4f93ac8762 | |||
37ec5b9c1a | |||
612950bdb2 | |||
3804ad1d23 | |||
1b1f228525 | |||
19e9094275 | |||
8ff3ab0e6d | |||
9e8d740a96 | |||
3a3a100b27 | |||
f0575e014c | |||
ea7737ee11 | |||
fadaf1e01a | |||
c716532ff2 | |||
1c112ae66e | |||
193a0ae4a0 | |||
9ceb5d1afe | |||
d6a8b0b686 | |||
3e216dd4ad | |||
7b0aba4655 | |||
7c87c52c38 | |||
541de26f7e | |||
74cb575219 |
@ -116,6 +116,8 @@ groups:
|
||||
- "modules/@angular/compiler/*"
|
||||
users:
|
||||
- tbosch #primary
|
||||
- vicb
|
||||
- chuckjaz
|
||||
- mhevery
|
||||
- IgorMinar #fallback
|
||||
|
||||
@ -197,7 +199,7 @@ groups:
|
||||
- "modules/@angular/platform-browser/*"
|
||||
users:
|
||||
- tbosch #primary
|
||||
- vicb
|
||||
- vicb #secondary
|
||||
- IgorMinar #fallback
|
||||
- mhevery #fallback
|
||||
|
||||
@ -208,6 +210,8 @@ groups:
|
||||
users:
|
||||
- vikerman #primary
|
||||
- alxhub
|
||||
- vicb
|
||||
- tbosch
|
||||
- IgorMinar #fallback
|
||||
- mhevery #fallback
|
||||
|
||||
@ -217,7 +221,7 @@ groups:
|
||||
- "modules/@angular/platform-webworker/*"
|
||||
users:
|
||||
- vicb #primary
|
||||
# needs secondary
|
||||
- tbosch #secondary
|
||||
- IgorMinar #fallback
|
||||
- mhevery #fallback
|
||||
|
||||
|
@ -1,10 +1,7 @@
|
||||
language: node_js
|
||||
sudo: false
|
||||
node_js:
|
||||
- '6.6.0'
|
||||
git:
|
||||
# Increased from default (50) to ensure last release tag is in this range
|
||||
depth: 150
|
||||
- '6.9.5'
|
||||
|
||||
addons:
|
||||
# firefox: "38.0"
|
||||
|
31
CHANGELOG.md
31
CHANGELOG.md
@ -1,3 +1,34 @@
|
||||
<a name="2.4.9"></a>
|
||||
## [2.4.9](https://github.com/angular/angular/compare/2.4.8...2.4.9) (2017-03-02)
|
||||
|
||||
|
||||
### Bug Fixes
|
||||
|
||||
* **http:** Make ResponseOptionsArgs an interface ([b658fa9](https://github.com/angular/angular/commit/b658fa9)), closes [#13708](https://github.com/angular/angular/issues/13708)
|
||||
* **router:** improve robustness ([#14602](https://github.com/angular/angular/issues/14602)) ([2a12346](https://github.com/angular/angular/commit/2a12346))
|
||||
|
||||
|
||||
### Reverts
|
||||
|
||||
* fix(router): do not finish bootstrap until all the routes are resolved ([#14327](https://github.com/angular/angular/issues/14327)) ([de36f8a](https://github.com/angular/angular/commit/de36f8a)), closes [#14681](https://github.com/angular/angular/issues/14681) [#14588](https://github.com/angular/angular/issues/14588)
|
||||
|
||||
|
||||
|
||||
<a name="2.4.8"></a>
|
||||
## [2.4.8](https://github.com/angular/angular/compare/2.4.7...2.4.8) (2017-02-18)
|
||||
|
||||
|
||||
### Bug Fixes
|
||||
|
||||
* **forms:** getRawValue should correctly work with nested FormGroups/Arrays ([#12964](https://github.com/angular/angular/issues/12964)) ([ea7737e](https://github.com/angular/angular/commit/ea7737e)), closes [#12963](https://github.com/angular/angular/issues/12963)
|
||||
* **http:** REVERT: remove dots from jsonp callback name ([#13219](https://github.com/angular/angular/issues/13219)) ([9ceb5d1](https://github.com/angular/angular/commit/9ceb5d1))
|
||||
* **platform-browser:** should only add styles with native encapsulation in shadow DOM ([#14313](https://github.com/angular/angular/issues/14313)) ([fadaf1e](https://github.com/angular/angular/commit/fadaf1e)), closes [#7887](https://github.com/angular/angular/issues/7887)
|
||||
* **router:** do not finish bootstrap until all the routes are resolved ([#14327](https://github.com/angular/angular/issues/14327)) ([541de26](https://github.com/angular/angular/commit/541de26)), closes [#12162](https://github.com/angular/angular/issues/12162)
|
||||
* **upgrade:** correctly project content on downgraded components with structural directives ([#14274](https://github.com/angular/angular/issues/14274)) ([74cb575](https://github.com/angular/angular/commit/74cb575)), closes [#14260](https://github.com/angular/angular/issues/14260)
|
||||
* **upgrade:** pass correct values to `ngOnChanges` for interpolation bindings ([#14400](https://github.com/angular/angular/issues/14400)) ([7c87c52](https://github.com/angular/angular/commit/7c87c52))
|
||||
|
||||
|
||||
|
||||
<a name="2.4.7"></a>
|
||||
## [2.4.7](https://github.com/angular/angular/compare/2.4.6...2.4.7) (2017-02-09)
|
||||
|
||||
|
@ -1,10 +1,10 @@
|
||||
machine:
|
||||
node:
|
||||
version: 6.6.0
|
||||
version: 6.9.5
|
||||
|
||||
dependencies:
|
||||
pre:
|
||||
- npm install -g npm@3.5.3
|
||||
- npm install -g npm@3.10.7
|
||||
|
||||
test:
|
||||
override:
|
||||
|
@ -11,8 +11,8 @@
|
||||
// THIS CHECK SHOULD BE THE FIRST THING IN THIS FILE
|
||||
// This is to ensure that we catch env issues before we error while requiring other dependencies.
|
||||
require('./tools/check-environment')({
|
||||
requiredNpmVersion: '>=3.5.3 <4.0.0',
|
||||
requiredNodeVersion: '>=5.4.1 <7.0.0',
|
||||
requiredNpmVersion: '>=3.10.7 <4.0.0',
|
||||
requiredNodeVersion: '>=6.9.5 <7.0.0',
|
||||
});
|
||||
|
||||
const gulp = require('gulp');
|
||||
|
@ -1020,7 +1020,7 @@ export class FormGroup extends AbstractControl {
|
||||
getRawValue(): any {
|
||||
return this._reduceChildren(
|
||||
{}, (acc: {[k: string]: AbstractControl}, control: AbstractControl, name: string) => {
|
||||
acc[name] = control.value;
|
||||
acc[name] = control instanceof FormControl ? control.value : (<any>control).getRawValue();
|
||||
return acc;
|
||||
});
|
||||
}
|
||||
@ -1321,7 +1321,11 @@ export class FormArray extends AbstractControl {
|
||||
* If you'd like to include all values regardless of disabled status, use this method.
|
||||
* Otherwise, the `value` property is the best way to get the value of the array.
|
||||
*/
|
||||
getRawValue(): any[] { return this.controls.map((control) => control.value); }
|
||||
getRawValue(): any[] {
|
||||
return this.controls.map((control: AbstractControl) => {
|
||||
return control instanceof FormControl ? control.value : (<any>control).getRawValue();
|
||||
});
|
||||
}
|
||||
|
||||
/** @internal */
|
||||
_throwIfControlMissing(index: number): void {
|
||||
|
@ -32,6 +32,7 @@ export function main() {
|
||||
}
|
||||
|
||||
describe('FormArray', () => {
|
||||
|
||||
describe('adding/removing', () => {
|
||||
let a: FormArray;
|
||||
let c1: FormControl, c2: FormControl, c3: FormControl;
|
||||
@ -81,6 +82,21 @@ export function main() {
|
||||
});
|
||||
});
|
||||
|
||||
describe('getRawValue()', () => {
|
||||
let a: FormArray;
|
||||
|
||||
it('should work with nested form groups/arrays', () => {
|
||||
a = new FormArray([
|
||||
new FormGroup({'c2': new FormControl('v2'), 'c3': new FormControl('v3')}),
|
||||
new FormArray([new FormControl('v4'), new FormControl('v5')])
|
||||
]);
|
||||
a.at(0).get('c3').disable();
|
||||
(a.at(1) as FormArray).at(1).disable();
|
||||
|
||||
expect(a.getRawValue()).toEqual([{'c2': 'v2', 'c3': 'v3'}, ['v4', 'v5']]);
|
||||
});
|
||||
});
|
||||
|
||||
describe('setValue', () => {
|
||||
let c: FormControl, c2: FormControl, a: FormArray;
|
||||
|
||||
|
@ -8,7 +8,7 @@
|
||||
|
||||
import {async, fakeAsync, tick} from '@angular/core/testing';
|
||||
import {AsyncTestCompleter, beforeEach, describe, inject, it} from '@angular/core/testing/testing_internal';
|
||||
import {AbstractControl, FormControl, FormGroup, Validators} from '@angular/forms';
|
||||
import {AbstractControl, FormArray, FormControl, FormGroup, Validators} from '@angular/forms';
|
||||
|
||||
import {EventEmitter} from '../src/facade/async';
|
||||
import {isPresent} from '../src/facade/lang';
|
||||
@ -62,6 +62,24 @@ export function main() {
|
||||
});
|
||||
});
|
||||
|
||||
describe('getRawValue', () => {
|
||||
let fg: FormGroup;
|
||||
|
||||
it('should work with nested form groups/arrays', () => {
|
||||
fg = new FormGroup({
|
||||
'c1': new FormControl('v1'),
|
||||
'group': new FormGroup({'c2': new FormControl('v2'), 'c3': new FormControl('v3')}),
|
||||
'array': new FormArray([new FormControl('v4'), new FormControl('v5')])
|
||||
});
|
||||
fg.get('group').get('c3').disable();
|
||||
(fg.get('array') as FormArray).at(1).disable();
|
||||
|
||||
expect(fg.getRawValue())
|
||||
.toEqual({'c1': 'v1', 'group': {'c2': 'v2', 'c3': 'v3'}, 'array': ['v4', 'v5']});
|
||||
});
|
||||
|
||||
});
|
||||
|
||||
describe('adding and removing controls', () => {
|
||||
it('should update value and validity when control is added', () => {
|
||||
const g = new FormGroup({'one': new FormControl('1')});
|
||||
|
@ -43,6 +43,10 @@ export function main() {
|
||||
it('should error on null',
|
||||
() => { expect(Validators.required(new FormControl(null))).toEqual({'required': true}); });
|
||||
|
||||
it('should not error on undefined', () => {
|
||||
expect(Validators.required(new FormControl(undefined))).toEqual({'required': true});
|
||||
});
|
||||
|
||||
it('should not error on a non-empty string',
|
||||
() => { expect(Validators.required(new FormControl('not empty'))).toBeNull(); });
|
||||
|
||||
@ -72,7 +76,7 @@ export function main() {
|
||||
() => { expect(Validators.minLength(2)(new FormControl(null))).toBeNull(); });
|
||||
|
||||
it('should not error on undefined',
|
||||
() => { expect(Validators.minLength(2)(new FormControl(null))).toBeNull(); });
|
||||
() => { expect(Validators.minLength(2)(new FormControl(undefined))).toBeNull(); });
|
||||
|
||||
it('should not error on valid strings',
|
||||
() => { expect(Validators.minLength(2)(new FormControl('aa'))).toBeNull(); });
|
||||
@ -103,6 +107,9 @@ export function main() {
|
||||
it('should not error on null',
|
||||
() => { expect(Validators.maxLength(2)(new FormControl(null))).toBeNull(); });
|
||||
|
||||
it('should not error on undefined',
|
||||
() => { expect(Validators.maxLength(2)(new FormControl(undefined))).toBeNull(); });
|
||||
|
||||
it('should not error on valid strings',
|
||||
() => { expect(Validators.maxLength(2)(new FormControl('aa'))).toBeNull(); });
|
||||
|
||||
@ -132,8 +139,9 @@ export function main() {
|
||||
it('should not error on null',
|
||||
() => { expect(Validators.pattern('[a-zA-Z ]+')(new FormControl(null))).toBeNull(); });
|
||||
|
||||
it('should not error on undefined',
|
||||
() => { expect(Validators.pattern('[a-zA-Z ]+')(new FormControl(null))).toBeNull(); });
|
||||
it('should not error on undefined', () => {
|
||||
expect(Validators.pattern('[a-zA-Z ]+')(new FormControl(undefined))).toBeNull();
|
||||
});
|
||||
|
||||
it('should not error on null value and "null" pattern',
|
||||
() => { expect(Validators.pattern('null')(new FormControl(null))).toBeNull(); });
|
||||
|
@ -32,23 +32,23 @@ export class BrowserJsonp {
|
||||
|
||||
nextRequestID(): string { return `__req${_nextRequestId++}`; }
|
||||
|
||||
requestCallback(id: string): string { return `${JSONP_HOME}${id}_finished`; }
|
||||
requestCallback(id: string): string { return `${JSONP_HOME}.${id}.finished`; }
|
||||
|
||||
exposeConnection(id: string, connection: any): void {
|
||||
exposeConnection(id: string, connection: any) {
|
||||
const connections = _getJsonpConnections();
|
||||
connections[id] = connection;
|
||||
}
|
||||
|
||||
removeConnection(id: string): void {
|
||||
removeConnection(id: string) {
|
||||
const connections = _getJsonpConnections();
|
||||
connections[id] = null;
|
||||
}
|
||||
|
||||
// Attach the <script> element to the DOM
|
||||
send(node: any): void { document.body.appendChild(<Node>(node)); }
|
||||
send(node: any) { document.body.appendChild(<Node>(node)); }
|
||||
|
||||
// Remove <script> element from the DOM
|
||||
cleanup(node: any): void {
|
||||
cleanup(node: any) {
|
||||
if (node.parentNode) {
|
||||
node.parentNode.removeChild(<Node>(node));
|
||||
}
|
||||
|
@ -66,9 +66,11 @@ export interface RequestArgs extends RequestOptionsArgs { url: string; }
|
||||
*
|
||||
* @experimental
|
||||
*/
|
||||
export type ResponseOptionsArgs = {
|
||||
body?: string | Object | FormData | ArrayBuffer | Blob; status?: number; statusText?: string;
|
||||
export interface ResponseOptionsArgs {
|
||||
body?: string|Object|FormData|ArrayBuffer|Blob;
|
||||
status?: number;
|
||||
statusText?: string;
|
||||
headers?: Headers;
|
||||
type?: ResponseType;
|
||||
url?: string;
|
||||
};
|
||||
}
|
||||
|
@ -70,11 +70,6 @@ export function main() {
|
||||
expect(instance).toBeAnInstanceOf(JSONPConnection);
|
||||
});
|
||||
|
||||
it('callback name should not contain dots', () => {
|
||||
const domJsonp = new MockBrowserJsonp();
|
||||
const callback: string = domJsonp.requestCallback(domJsonp.nextRequestID());
|
||||
expect(callback.indexOf('.') === -1).toBeTruthy();
|
||||
});
|
||||
|
||||
describe('JSONPConnection', () => {
|
||||
it('should use the injected BaseResponseOptions to create the response',
|
||||
|
@ -127,7 +127,6 @@ export class DomRenderer implements Renderer {
|
||||
let nodesParent: Element|DocumentFragment;
|
||||
if (this.componentProto.encapsulation === ViewEncapsulation.Native) {
|
||||
nodesParent = (hostElement as any).createShadowRoot();
|
||||
this._rootRenderer.sharedStylesHost.addHost(nodesParent);
|
||||
for (let i = 0; i < this._styles.length; i++) {
|
||||
const styleEl = document.createElement('style');
|
||||
styleEl.textContent = this._styles[i];
|
||||
|
@ -0,0 +1,85 @@
|
||||
/**
|
||||
* @license
|
||||
* Copyright Google Inc. All Rights Reserved.
|
||||
*
|
||||
* Use of this source code is governed by an MIT-style license that can be
|
||||
* found in the LICENSE file at https://angular.io/license
|
||||
*/
|
||||
import {CommonModule} from '@angular/common';
|
||||
import {Component, NgModule, ViewEncapsulation} from '@angular/core';
|
||||
import {TestBed} from '@angular/core/testing';
|
||||
import {describe, it} from '@angular/core/testing/testing_internal';
|
||||
import {BrowserModule} from '@angular/platform-browser';
|
||||
import {By} from '@angular/platform-browser/src/dom/debug/by';
|
||||
import {browserDetection} from '@angular/platform-browser/testing/browser_util';
|
||||
import {expect} from '@angular/platform-browser/testing/matchers';
|
||||
|
||||
export function main() {
|
||||
describe('DomRenderer', () => {
|
||||
|
||||
beforeEach(() => TestBed.configureTestingModule({imports: [BrowserModule, TestModule]}));
|
||||
|
||||
// other browsers don't support shadow dom
|
||||
if (browserDetection.isChromeDesktop) {
|
||||
it('should add only styles with native encapsulation to the shadow DOM', () => {
|
||||
const fixture = TestBed.createComponent(SomeApp);
|
||||
fixture.detectChanges();
|
||||
|
||||
const cmp = fixture.debugElement.query(By.css('cmp-native')).nativeElement;
|
||||
const styles = cmp.shadowRoot.querySelectorAll('style');
|
||||
expect(styles.length).toBe(1);
|
||||
expect(styles[0]).toHaveText('.cmp-native { color: red; }');
|
||||
});
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
@Component({
|
||||
selector: 'cmp-native',
|
||||
template: ``,
|
||||
styles: [`.cmp-native { color: red; }`],
|
||||
encapsulation: ViewEncapsulation.Native
|
||||
})
|
||||
class CmpEncapsulationNative {
|
||||
}
|
||||
|
||||
@Component({
|
||||
selector: 'cmp-emulated',
|
||||
template: ``,
|
||||
styles: [`.cmp-emulated { color: blue; }`],
|
||||
encapsulation: ViewEncapsulation.Emulated
|
||||
})
|
||||
class CmpEncapsulationEmulated {
|
||||
}
|
||||
|
||||
@Component({
|
||||
selector: 'cmp-none',
|
||||
template: ``,
|
||||
styles: [`.cmp-none { color: yellow; }`],
|
||||
encapsulation: ViewEncapsulation.None
|
||||
})
|
||||
class CmpEncapsulationNone {
|
||||
}
|
||||
|
||||
@Component({
|
||||
selector: 'some-app',
|
||||
template: `
|
||||
<cmp-native></cmp-native>
|
||||
<cmp-emulated></cmp-emulated>
|
||||
<cmp-none></cmp-none>
|
||||
`,
|
||||
})
|
||||
export class SomeApp {
|
||||
}
|
||||
|
||||
@NgModule({
|
||||
declarations: [
|
||||
SomeApp,
|
||||
CmpEncapsulationNative,
|
||||
CmpEncapsulationEmulated,
|
||||
CmpEncapsulationNone,
|
||||
],
|
||||
imports: [CommonModule]
|
||||
})
|
||||
class TestModule {
|
||||
}
|
@ -6,7 +6,7 @@ Managing state transitions is one of the hardest parts of building applications.
|
||||
The Angular router is designed to solve these problems. Using the router, you can declaratively specify application state, manage state transitions while taking care of the URL, and load components on demand.
|
||||
|
||||
## Overview
|
||||
Read the overview of the Router [here](http://victorsavkin.com/post/145672529346/angular-router).
|
||||
Read the overview of the Router [here](https://vsavkin.com/angular-2-router-d9e30599f9ea).
|
||||
|
||||
## Guide
|
||||
Read the dev guide [here](https://angular.io/docs/ts/latest/guide/router.html).
|
||||
|
@ -13,7 +13,7 @@ import {ActivatedRouteSnapshot, RouterStateSnapshot} from './router_state';
|
||||
|
||||
|
||||
/**
|
||||
* @whatItDoes Indicates that a class can implement to be a guard deciding if a route can be
|
||||
* @whatItDoes Interface that a class can implement to be a guard deciding if a route can be
|
||||
* activated.
|
||||
*
|
||||
* @howToUse
|
||||
@ -53,7 +53,7 @@ import {ActivatedRouteSnapshot, RouterStateSnapshot} from './router_state';
|
||||
* class AppModule {}
|
||||
* ```
|
||||
*
|
||||
* You can also provide a function with the same signature instead of the class:
|
||||
* You can alternatively provide a function with the `canActivate` signature:
|
||||
*
|
||||
* ```
|
||||
* @NgModule({
|
||||
@ -84,7 +84,7 @@ export interface CanActivate {
|
||||
}
|
||||
|
||||
/**
|
||||
* @whatItDoes Indicates that a class can implement to be a guard deciding if a child route can be
|
||||
* @whatItDoes Interface that a class can implement to be a guard deciding if a child route can be
|
||||
* activated.
|
||||
*
|
||||
* @howToUse
|
||||
@ -129,7 +129,7 @@ export interface CanActivate {
|
||||
* class AppModule {}
|
||||
* ```
|
||||
*
|
||||
* You can also provide a function with the same signature instead of the class:
|
||||
* You can alternatively provide a function with the `canActivateChild` signature:
|
||||
*
|
||||
* ```
|
||||
* @NgModule({
|
||||
@ -159,14 +159,13 @@ export interface CanActivate {
|
||||
*
|
||||
* @stable
|
||||
*/
|
||||
|
||||
export interface CanActivateChild {
|
||||
canActivateChild(childRoute: ActivatedRouteSnapshot, state: RouterStateSnapshot):
|
||||
Observable<boolean>|Promise<boolean>|boolean;
|
||||
}
|
||||
|
||||
/**
|
||||
* @whatItDoes Indicates that a class can implement to be a guard deciding if a route can be
|
||||
* @whatItDoes Interface that a class can implement to be a guard deciding if a route can be
|
||||
* deactivated.
|
||||
*
|
||||
* @howToUse
|
||||
@ -207,7 +206,7 @@ export interface CanActivateChild {
|
||||
* class AppModule {}
|
||||
* ```
|
||||
*
|
||||
* You can also provide a function with the same signature instead of the class:
|
||||
* You can alternatively provide a function with the `canDeactivate` signature:
|
||||
*
|
||||
* ```
|
||||
* @NgModule({
|
||||
@ -238,7 +237,7 @@ export interface CanDeactivate<T> {
|
||||
}
|
||||
|
||||
/**
|
||||
* @whatItDoes Indicates that class can implement to be a data provider.
|
||||
* @whatItDoes Interface that class can implement to be a data provider.
|
||||
*
|
||||
* @howToUse
|
||||
*
|
||||
@ -278,7 +277,7 @@ export interface CanDeactivate<T> {
|
||||
* class AppModule {}
|
||||
* ```
|
||||
*
|
||||
* You can also provide a function with the same signature instead of the class.
|
||||
* You can alternatively provide a function with the `resolve` signature:
|
||||
*
|
||||
* ```
|
||||
* @NgModule({
|
||||
@ -310,7 +309,7 @@ export interface Resolve<T> {
|
||||
|
||||
|
||||
/**
|
||||
* @whatItDoes Indicates that a class can implement to be a guard deciding if a children can be
|
||||
* @whatItDoes Interface that a class can implement to be a guard deciding if a children can be
|
||||
* loaded.
|
||||
*
|
||||
* @howToUse
|
||||
@ -350,7 +349,7 @@ export interface Resolve<T> {
|
||||
* class AppModule {}
|
||||
* ```
|
||||
*
|
||||
* You can also provide a function with the same signature instead of the class:
|
||||
* You can alternatively provide a function with the `canLoad` signature:
|
||||
*
|
||||
* ```
|
||||
* @NgModule({
|
||||
|
@ -44,10 +44,13 @@ export class RouterConfigLoader {
|
||||
if (typeof loadChildren === 'string') {
|
||||
return fromPromise(this.loader.load(loadChildren));
|
||||
} else {
|
||||
const offlineMode = this.compiler instanceof Compiler;
|
||||
return mergeMap.call(
|
||||
wrapIntoObservable(loadChildren()),
|
||||
(t: any) => offlineMode ? of (<any>t) : fromPromise(this.compiler.compileModuleAsync(t)));
|
||||
return mergeMap.call(wrapIntoObservable(loadChildren()), (t: NgModuleFactory<any>| any) => {
|
||||
if (t instanceof NgModuleFactory) {
|
||||
return of (t);
|
||||
} else {
|
||||
return fromPromise(this.compiler.compileModuleAsync(t));
|
||||
}
|
||||
});
|
||||
}
|
||||
}
|
||||
}
|
||||
|
@ -8,6 +8,8 @@
|
||||
|
||||
export type Ng1Token = string;
|
||||
|
||||
export type Ng1Expression = string | Function;
|
||||
|
||||
export interface IAnnotatedFunction extends Function { $inject?: Ng1Token[]; }
|
||||
|
||||
export type IInjectable = (Ng1Token | Function)[] | IAnnotatedFunction;
|
||||
@ -45,9 +47,7 @@ export interface IRootScopeService {
|
||||
$watch(expr: any, fn?: (a1?: any, a2?: any) => void): Function;
|
||||
$on(event: string, fn?: (event?: any, ...args: any[]) => void): Function;
|
||||
$destroy(): any;
|
||||
$apply(): any;
|
||||
$apply(exp: string): any;
|
||||
$apply(exp: Function): any;
|
||||
$apply(exp?: Ng1Expression): any;
|
||||
$digest(): any;
|
||||
$evalAsync(): any;
|
||||
$on(event: string, fn?: (event?: any, ...args: any[]) => void): Function;
|
||||
|
@ -57,16 +57,15 @@ export class DowngradeComponentAdapter {
|
||||
let expr: any /** TODO #9100 */ = null;
|
||||
|
||||
if (attrs.hasOwnProperty(input.attr)) {
|
||||
const observeFn = ((prop: any /** TODO #9100 */) => {
|
||||
const observeFn = (prop => {
|
||||
let prevValue = INITIAL_VALUE;
|
||||
return (value: any /** TODO #9100 */) => {
|
||||
if (this.inputChanges !== null) {
|
||||
this.inputChangeCount++;
|
||||
this.inputChanges[prop] =
|
||||
new Ng1Change(value, prevValue === INITIAL_VALUE ? value : prevValue);
|
||||
prevValue = value;
|
||||
return (currValue: any) => {
|
||||
if (prevValue === INITIAL_VALUE) {
|
||||
prevValue = currValue;
|
||||
}
|
||||
this.component[prop] = value;
|
||||
|
||||
this.updateInput(prop, prevValue, currValue);
|
||||
prevValue = currValue;
|
||||
};
|
||||
})(input.prop);
|
||||
attrs.$observe(input.attr, observeFn);
|
||||
@ -82,14 +81,8 @@ export class DowngradeComponentAdapter {
|
||||
}
|
||||
if (expr != null) {
|
||||
const watchFn =
|
||||
((prop: any /** TODO #9100 */) =>
|
||||
(value: any /** TODO #9100 */, prevValue: any /** TODO #9100 */) => {
|
||||
if (this.inputChanges != null) {
|
||||
this.inputChangeCount++;
|
||||
this.inputChanges[prop] = new Ng1Change(prevValue, value);
|
||||
}
|
||||
this.component[prop] = value;
|
||||
})(input.prop);
|
||||
(prop => (currValue: any, prevValue: any) =>
|
||||
this.updateInput(prop, prevValue, currValue))(input.prop);
|
||||
this.componentScope.$watch(expr, watchFn);
|
||||
}
|
||||
}
|
||||
@ -171,6 +164,15 @@ export class DowngradeComponentAdapter {
|
||||
this.componentRef.destroy();
|
||||
});
|
||||
}
|
||||
|
||||
private updateInput(prop: string, prevValue: any, currValue: any) {
|
||||
if (this.inputChanges) {
|
||||
this.inputChangeCount++;
|
||||
this.inputChanges[prop] = new Ng1Change(prevValue, currValue);
|
||||
}
|
||||
|
||||
this.component[prop] = currValue;
|
||||
}
|
||||
}
|
||||
|
||||
class Ng1Change implements SimpleChange {
|
||||
|
@ -49,16 +49,15 @@ export class DowngradeNg2ComponentAdapter {
|
||||
const input = inputs[i];
|
||||
let expr: any /** TODO #9100 */ = null;
|
||||
if (attrs.hasOwnProperty(input.attr)) {
|
||||
const observeFn = ((prop: any /** TODO #9100 */) => {
|
||||
const observeFn = (prop => {
|
||||
let prevValue = INITIAL_VALUE;
|
||||
return (value: any /** TODO #9100 */) => {
|
||||
if (this.inputChanges !== null) {
|
||||
this.inputChangeCount++;
|
||||
this.inputChanges[prop] =
|
||||
new Ng1Change(value, prevValue === INITIAL_VALUE ? value : prevValue);
|
||||
prevValue = value;
|
||||
return (currValue: any) => {
|
||||
if (prevValue === INITIAL_VALUE) {
|
||||
prevValue = currValue;
|
||||
}
|
||||
this.component[prop] = value;
|
||||
|
||||
this.updateInput(prop, prevValue, currValue);
|
||||
prevValue = currValue;
|
||||
};
|
||||
})(input.prop);
|
||||
attrs.$observe(input.attr, observeFn);
|
||||
@ -73,14 +72,8 @@ export class DowngradeNg2ComponentAdapter {
|
||||
}
|
||||
if (expr != null) {
|
||||
const watchFn =
|
||||
((prop: any /** TODO #9100 */) =>
|
||||
(value: any /** TODO #9100 */, prevValue: any /** TODO #9100 */) => {
|
||||
if (this.inputChanges != null) {
|
||||
this.inputChangeCount++;
|
||||
this.inputChanges[prop] = new Ng1Change(prevValue, value);
|
||||
}
|
||||
this.component[prop] = value;
|
||||
})(input.prop);
|
||||
(prop => (currValue: any, prevValue: any) =>
|
||||
this.updateInput(prop, prevValue, currValue))(input.prop);
|
||||
this.componentScope.$watch(expr, watchFn);
|
||||
}
|
||||
}
|
||||
@ -151,6 +144,15 @@ export class DowngradeNg2ComponentAdapter {
|
||||
this.componentRef.destroy();
|
||||
});
|
||||
}
|
||||
|
||||
private updateInput(prop: string, prevValue: any, currValue: any) {
|
||||
if (this.inputChanges) {
|
||||
this.inputChangeCount++;
|
||||
this.inputChanges[prop] = new Ng1Change(prevValue, currValue);
|
||||
}
|
||||
|
||||
this.component[prop] = currValue;
|
||||
}
|
||||
}
|
||||
|
||||
class Ng1Change implements SimpleChange {
|
||||
|
@ -656,14 +656,11 @@ function ng1ComponentDirective(info: ComponentInfo, idPrefix: string): Function
|
||||
restrict: 'E',
|
||||
terminal: true,
|
||||
require: REQUIRE_INJECTOR,
|
||||
compile: (templateElement: angular.IAugmentedJQuery, templateAttributes: angular.IAttributes,
|
||||
transclude: angular.ITranscludeFunction) => {
|
||||
link: (scope: angular.IScope, element: angular.IAugmentedJQuery, attrs: angular.IAttributes,
|
||||
parentInjector: Injector | ParentInjectorPromise): void => {
|
||||
// We might have compile the contents lazily, because this might have been triggered by the
|
||||
// UpgradeNg1ComponentAdapterBuilder, when the ng2 templates have not been compiled yet
|
||||
return {
|
||||
post: (scope: angular.IScope, element: angular.IAugmentedJQuery,
|
||||
attrs: angular.IAttributes, parentInjector: Injector | ParentInjectorPromise,
|
||||
transclude: angular.ITranscludeFunction): void => {
|
||||
|
||||
let id = idPrefix + (idCount++);
|
||||
(<any>element[0]).id = id;
|
||||
|
||||
@ -671,11 +668,10 @@ function ng1ComponentDirective(info: ComponentInfo, idPrefix: string): Function
|
||||
|
||||
const ng2Compiler = ng1Injector.get(NG2_COMPILER) as Compiler;
|
||||
const ngContentSelectors = ng2Compiler.getNgContentSelectors(info.type);
|
||||
const linkFns = compileProjectedNodes(templateElement, ngContentSelectors);
|
||||
const linkFns = compileProjectedNodes(element, ngContentSelectors);
|
||||
|
||||
const componentFactory: ComponentFactory<any> = componentFactoryRefMap[info.selector];
|
||||
if (!componentFactory)
|
||||
throw new Error('Expecting ComponentFactory for: ' + info.selector);
|
||||
if (!componentFactory) throw new Error('Expecting ComponentFactory for: ' + info.selector);
|
||||
|
||||
element.empty();
|
||||
let projectableNodes = linkFns.map(link => {
|
||||
@ -706,17 +702,13 @@ function ng1ComponentDirective(info: ComponentInfo, idPrefix: string): Function
|
||||
}
|
||||
}
|
||||
};
|
||||
}
|
||||
};
|
||||
|
||||
function compileProjectedNodes(
|
||||
templateElement: angular.IAugmentedJQuery,
|
||||
ngContentSelectors: string[]): angular.ILinkFn[] {
|
||||
element: angular.IAugmentedJQuery, ngContentSelectors: string[]): angular.ILinkFn[] {
|
||||
if (!ngContentSelectors)
|
||||
throw new Error('Expecting ngContentSelectors for: ' + info.selector);
|
||||
// We have to sort the projected content before we compile it, hence the terminal: true
|
||||
let projectableTemplateNodes =
|
||||
sortProjectableNodes(ngContentSelectors, templateElement.contents());
|
||||
let projectableTemplateNodes = sortProjectableNodes(ngContentSelectors, element.contents());
|
||||
return projectableTemplateNodes.map(nodes => ng1Compile(nodes));
|
||||
}
|
||||
}
|
||||
|
@ -6,14 +6,14 @@
|
||||
* found in the LICENSE file at https://angular.io/license
|
||||
*/
|
||||
|
||||
import {Component, Directive, ElementRef, Injector, NgModule, destroyPlatform} from '@angular/core';
|
||||
import {Component, Directive, ElementRef, Injector, Input, NgModule, destroyPlatform} from '@angular/core';
|
||||
import {async} from '@angular/core/testing';
|
||||
import {BrowserModule} from '@angular/platform-browser';
|
||||
import {platformBrowserDynamic} from '@angular/platform-browser-dynamic';
|
||||
import * as angular from '@angular/upgrade/src/angular_js';
|
||||
import {UpgradeComponent, UpgradeModule, downgradeComponent} from '@angular/upgrade/static';
|
||||
|
||||
import {bootstrap, html} from '../test_helpers';
|
||||
import {bootstrap, html, multiTrim} from '../test_helpers';
|
||||
|
||||
export function main() {
|
||||
describe('content projection', () => {
|
||||
@ -52,6 +52,44 @@ export function main() {
|
||||
});
|
||||
}));
|
||||
|
||||
it('should correctly project structural directives', async(() => {
|
||||
@Component({selector: 'ng2', template: 'ng2-{{ itemId }}(<ng-content></ng-content>)'})
|
||||
class Ng2Component {
|
||||
@Input() itemId: string;
|
||||
}
|
||||
|
||||
@NgModule({
|
||||
imports: [BrowserModule, UpgradeModule],
|
||||
declarations: [Ng2Component],
|
||||
entryComponents: [Ng2Component]
|
||||
})
|
||||
class Ng2Module {
|
||||
ngDoBootstrap() {}
|
||||
}
|
||||
|
||||
const ng1Module =
|
||||
angular.module('ng1', [])
|
||||
.directive(
|
||||
'ng2', downgradeComponent({component: Ng2Component, inputs: ['itemId']}))
|
||||
.run(($rootScope: angular.IRootScopeService) => {
|
||||
$rootScope['items'] = [
|
||||
{id: 'a', subitems: [1, 2, 3]}, {id: 'b', subitems: [4, 5, 6]},
|
||||
{id: 'c', subitems: [7, 8, 9]}
|
||||
];
|
||||
});
|
||||
|
||||
const element = html(`
|
||||
<ng2 ng-repeat="item in items" [item-id]="item.id">
|
||||
<div ng-repeat="subitem in item.subitems">{{ subitem }}</div>
|
||||
</ng2>
|
||||
`);
|
||||
|
||||
bootstrap(platformBrowserDynamic(), Ng2Module, element, ng1Module).then(upgrade => {
|
||||
expect(multiTrim(document.body.textContent))
|
||||
.toBe('ng2-a( 123 )ng2-b( 456 )ng2-c( 789 )');
|
||||
});
|
||||
}));
|
||||
|
||||
it('should instantiate ng1 in ng2 template and project content', async(() => {
|
||||
|
||||
@Component({
|
||||
|
@ -13,7 +13,7 @@ import {platformBrowserDynamic} from '@angular/platform-browser-dynamic';
|
||||
import * as angular from '@angular/upgrade/src/angular_js';
|
||||
import {UpgradeModule, downgradeComponent} from '@angular/upgrade/static';
|
||||
|
||||
import {bootstrap, html, multiTrim} from '../test_helpers';
|
||||
import {$apply, bootstrap, html, multiTrim} from '../test_helpers';
|
||||
|
||||
export function main() {
|
||||
describe('downgrade ng2 component', () => {
|
||||
@ -22,8 +22,11 @@ export function main() {
|
||||
afterEach(() => destroyPlatform());
|
||||
|
||||
it('should bind properties, events', async(() => {
|
||||
|
||||
const ng1Module = angular.module('ng1', []).run(($rootScope: angular.IScope) => {
|
||||
const ng1Module =
|
||||
angular.module('ng1', []).value('$exceptionHandler', (err: any) => {
|
||||
throw err;
|
||||
}).run(($rootScope: angular.IScope) => {
|
||||
$rootScope['name'] = 'world';
|
||||
$rootScope['dataA'] = 'A';
|
||||
$rootScope['dataB'] = 'B';
|
||||
$rootScope['modelA'] = 'initModelA';
|
||||
@ -94,9 +97,10 @@ export function main() {
|
||||
break;
|
||||
case 1:
|
||||
assertChange('twoWayA', 'newA');
|
||||
assertChange('twoWayB', 'newB');
|
||||
break;
|
||||
case 2:
|
||||
assertChange('twoWayB', 'newB');
|
||||
assertChange('interpolate', 'Hello everyone');
|
||||
break;
|
||||
default:
|
||||
throw new Error('Called too many times! ' + JSON.stringify(changes));
|
||||
@ -125,7 +129,7 @@ export function main() {
|
||||
|
||||
const element = html(`
|
||||
<div>
|
||||
<ng2 literal="Text" interpolate="Hello {{'world'}}"
|
||||
<ng2 literal="Text" interpolate="Hello {{name}}"
|
||||
bind-one-way-a="dataA" [one-way-b]="dataB"
|
||||
bindon-two-way-a="modelA" [(two-way-b)]="modelB"
|
||||
on-event-a='eventA=$event' (event-b)="eventB=$event"></ng2>
|
||||
@ -139,6 +143,14 @@ export function main() {
|
||||
'literal: Text; interpolate: Hello world; ' +
|
||||
'oneWayA: A; oneWayB: B; twoWayA: newA; twoWayB: newB; (2) | ' +
|
||||
'modelA: newA; modelB: newB; eventA: aFired; eventB: bFired;');
|
||||
|
||||
$apply(upgrade, 'name = "everyone"');
|
||||
expect(multiTrim(document.body.textContent))
|
||||
.toEqual(
|
||||
'ignore: -; ' +
|
||||
'literal: Text; interpolate: Hello everyone; ' +
|
||||
'oneWayA: A; oneWayB: B; twoWayA: newA; twoWayB: newB; (3) | ' +
|
||||
'modelA: newA; modelB: newB; eventA: aFired; eventB: bFired;');
|
||||
});
|
||||
}));
|
||||
|
||||
|
@ -13,7 +13,7 @@ import {platformBrowserDynamic} from '@angular/platform-browser-dynamic';
|
||||
import * as angular from '@angular/upgrade/src/angular_js';
|
||||
import {UpgradeComponent, UpgradeModule, downgradeComponent} from '@angular/upgrade/static';
|
||||
|
||||
import {bootstrap, digest, html, multiTrim} from '../test_helpers';
|
||||
import {$digest, bootstrap, html, multiTrim} from '../test_helpers';
|
||||
|
||||
export function main() {
|
||||
describe('upgrade ng1 component', () => {
|
||||
@ -530,7 +530,7 @@ export function main() {
|
||||
|
||||
ng2ComponentInstance.dataA = 'foo2';
|
||||
ng2ComponentInstance.dataB = 'bar2';
|
||||
digest(adapter);
|
||||
$digest(adapter);
|
||||
tick();
|
||||
|
||||
expect(multiTrim(element.textContent))
|
||||
@ -605,7 +605,7 @@ export function main() {
|
||||
|
||||
ng2ComponentInstance.dataA = {value: 'foo2'};
|
||||
ng2ComponentInstance.dataB = {value: 'bar2'};
|
||||
digest(adapter);
|
||||
$digest(adapter);
|
||||
tick();
|
||||
|
||||
expect(multiTrim(element.textContent))
|
||||
@ -682,7 +682,7 @@ export function main() {
|
||||
|
||||
ng2ComponentInstance.dataA = {value: 'foo2'};
|
||||
ng2ComponentInstance.dataB = {value: 'bar2'};
|
||||
digest(adapter);
|
||||
$digest(adapter);
|
||||
tick();
|
||||
|
||||
expect(multiTrim(element.textContent))
|
||||
@ -929,7 +929,7 @@ export function main() {
|
||||
|
||||
ng1Controller1.outputA({value: 'foo again'});
|
||||
ng1Controller2.outputB('bar again');
|
||||
digest(adapter);
|
||||
$digest(adapter);
|
||||
tick();
|
||||
|
||||
expect(ng1Controller0.inputA).toEqual({value: 'foo again'});
|
||||
@ -1010,7 +1010,7 @@ export function main() {
|
||||
.toBe('ng1 - Data: [4,5] - Length: 2 | ng2 - Data: 4,5 - Length: 2');
|
||||
|
||||
ng1Controller.$scope.outputA(6);
|
||||
digest(adapter);
|
||||
$digest(adapter);
|
||||
tick();
|
||||
|
||||
expect(ng1Controller.$scope.inputA).toEqual([4, 5, 6]);
|
||||
@ -1858,7 +1858,7 @@ export function main() {
|
||||
|
||||
// Change: Re-assign `data`
|
||||
ng2ComponentInstance.data = {foo: 'baz'};
|
||||
digest(adapter);
|
||||
$digest(adapter);
|
||||
tick();
|
||||
|
||||
expect(scopeOnChanges.calls.count()).toBe(2);
|
||||
@ -1879,7 +1879,7 @@ export function main() {
|
||||
|
||||
// No change: Update internal property
|
||||
ng2ComponentInstance.data.foo = 'qux';
|
||||
digest(adapter);
|
||||
$digest(adapter);
|
||||
tick();
|
||||
|
||||
expect(scopeOnChanges.calls.count()).toBe(2);
|
||||
@ -1888,7 +1888,7 @@ export function main() {
|
||||
|
||||
// Change: Re-assign `data` (even if it looks the same)
|
||||
ng2ComponentInstance.data = {foo: 'qux'};
|
||||
digest(adapter);
|
||||
$digest(adapter);
|
||||
tick();
|
||||
|
||||
expect(scopeOnChanges.calls.count()).toBe(3);
|
||||
@ -2008,7 +2008,7 @@ export function main() {
|
||||
|
||||
// Change: Re-assign `data`
|
||||
ng2ComponentInstance.data = {foo: 'baz'};
|
||||
digest(adapter);
|
||||
$digest(adapter);
|
||||
tick();
|
||||
|
||||
expect(scopeOnChangesA.calls.count()).toBe(2);
|
||||
@ -2029,7 +2029,7 @@ export function main() {
|
||||
|
||||
// No change: Update internal property
|
||||
ng2ComponentInstance.data.foo = 'qux';
|
||||
digest(adapter);
|
||||
$digest(adapter);
|
||||
tick();
|
||||
|
||||
expect(scopeOnChangesA.calls.count()).toBe(2);
|
||||
@ -2039,7 +2039,7 @@ export function main() {
|
||||
|
||||
// Change: Re-assign `data` (even if it looks the same)
|
||||
ng2ComponentInstance.data = {foo: 'qux'};
|
||||
digest(adapter);
|
||||
$digest(adapter);
|
||||
tick();
|
||||
|
||||
expect(scopeOnChangesA.calls.count()).toBe(3);
|
||||
@ -2631,7 +2631,7 @@ export function main() {
|
||||
expect(scopeDestroyListener).not.toHaveBeenCalled();
|
||||
|
||||
ng2ComponentAInstance.destroyIt = true;
|
||||
digest(adapter);
|
||||
$digest(adapter);
|
||||
|
||||
expect(scopeDestroyListener).toHaveBeenCalled();
|
||||
});
|
||||
@ -2795,7 +2795,7 @@ export function main() {
|
||||
// (Should not propagate upwards.)
|
||||
ng2ComponentBInstance.ng2BInputA = 'foo2';
|
||||
ng2ComponentBInstance.ng2BInputC = 'baz2';
|
||||
digest(adapter);
|
||||
$digest(adapter);
|
||||
tick();
|
||||
|
||||
expect(multiTrim(document.body.textContent))
|
||||
@ -2805,7 +2805,7 @@ export function main() {
|
||||
// (Should propagate all the way up to `ng1ADataC` and back all the way down to
|
||||
// `ng2BInputC`.)
|
||||
ng2ComponentBInstance.ng2BOutputC.emit('baz3');
|
||||
digest(adapter);
|
||||
$digest(adapter);
|
||||
tick();
|
||||
|
||||
expect(multiTrim(document.body.textContent))
|
||||
@ -2815,7 +2815,7 @@ export function main() {
|
||||
// (Should not propagate upwards, only downwards.)
|
||||
ng1ControllerXInstance.ng1XInputA = 'foo4';
|
||||
ng1ControllerXInstance.ng1XInputB = {value: 'bar4'};
|
||||
digest(adapter);
|
||||
$digest(adapter);
|
||||
tick();
|
||||
|
||||
expect(multiTrim(document.body.textContent))
|
||||
@ -2824,7 +2824,7 @@ export function main() {
|
||||
// Update `ng1XInputC`.
|
||||
// (Should propagate upwards and downwards.)
|
||||
ng1ControllerXInstance.ng1XInputC = {value: 'baz5'};
|
||||
digest(adapter);
|
||||
$digest(adapter);
|
||||
tick();
|
||||
|
||||
expect(multiTrim(document.body.textContent))
|
||||
@ -2833,7 +2833,7 @@ export function main() {
|
||||
// Update a property on `ng1XInputC`.
|
||||
// (Should propagate upwards and downwards.)
|
||||
ng1ControllerXInstance.ng1XInputC.value = 'baz6';
|
||||
digest(adapter);
|
||||
$digest(adapter);
|
||||
tick();
|
||||
|
||||
expect(multiTrim(document.body.textContent))
|
||||
@ -2842,7 +2842,7 @@ export function main() {
|
||||
// Emit from `ng1XOutputA`.
|
||||
// (Should propagate upwards to `ng1ADataA` and back all the way down to `ng2BInputA`.)
|
||||
(ng1ControllerXInstance as any).ng1XOutputA({value: 'foo7'});
|
||||
digest(adapter);
|
||||
$digest(adapter);
|
||||
tick();
|
||||
|
||||
expect(multiTrim(document.body.textContent))
|
||||
@ -2852,7 +2852,7 @@ export function main() {
|
||||
// (Should propagate upwards to `ng1ADataB`, but not downwards,
|
||||
// since `ng1XInputB` has been re-assigned (i.e. `ng2ADataB !== ng1XInputB`).)
|
||||
(ng1ControllerXInstance as any).ng1XOutputB('bar8');
|
||||
digest(adapter);
|
||||
$digest(adapter);
|
||||
tick();
|
||||
|
||||
expect(multiTrim(document.body.textContent))
|
||||
@ -2863,7 +2863,7 @@ export function main() {
|
||||
ng2ComponentAInstance.ng2ADataA = {value: 'foo9'};
|
||||
ng2ComponentAInstance.ng2ADataB = {value: 'bar9'};
|
||||
ng2ComponentAInstance.ng2ADataC = {value: 'baz9'};
|
||||
digest(adapter);
|
||||
$digest(adapter);
|
||||
tick();
|
||||
|
||||
expect(multiTrim(document.body.textContent))
|
||||
|
@ -21,11 +21,6 @@ export function bootstrap(
|
||||
});
|
||||
}
|
||||
|
||||
export function digest(adapter: UpgradeModule) {
|
||||
const $rootScope = adapter.$injector.get($ROOT_SCOPE) as angular.IRootScopeService;
|
||||
$rootScope.$digest();
|
||||
}
|
||||
|
||||
export function html(html: string): Element {
|
||||
// Don't return `body` itself, because using it as a `$rootElement` for ng1
|
||||
// will attach `$injector` to it and that will affect subsequent tests.
|
||||
@ -43,3 +38,13 @@ export function html(html: string): Element {
|
||||
export function multiTrim(text: string): string {
|
||||
return text.replace(/\n/g, '').replace(/\s\s+/g, ' ').trim();
|
||||
}
|
||||
|
||||
export function $apply(adapter: UpgradeModule, exp: angular.Ng1Expression) {
|
||||
const $rootScope = adapter.$injector.get($ROOT_SCOPE) as angular.IRootScopeService;
|
||||
$rootScope.$apply(exp);
|
||||
}
|
||||
|
||||
export function $digest(adapter: UpgradeModule) {
|
||||
const $rootScope = adapter.$injector.get($ROOT_SCOPE) as angular.IRootScopeService;
|
||||
$rootScope.$digest();
|
||||
}
|
||||
|
@ -291,9 +291,11 @@ export function main() {
|
||||
|
||||
it('should bind properties, events', async(() => {
|
||||
const adapter: UpgradeAdapter = new UpgradeAdapter(forwardRef(() => Ng2Module));
|
||||
const ng1Module = angular.module('ng1', []);
|
||||
const ng1Module =
|
||||
angular.module('ng1', []).value('$exceptionHandler', (err: any) => { throw err; });
|
||||
|
||||
ng1Module.run(($rootScope: any) => {
|
||||
$rootScope.name = 'world';
|
||||
$rootScope.dataA = 'A';
|
||||
$rootScope.dataB = 'B';
|
||||
$rootScope.modelA = 'initModelA';
|
||||
@ -364,9 +366,10 @@ export function main() {
|
||||
break;
|
||||
case 1:
|
||||
assertChange('twoWayA', 'newA');
|
||||
assertChange('twoWayB', 'newB');
|
||||
break;
|
||||
case 2:
|
||||
assertChange('twoWayB', 'newB');
|
||||
assertChange('interpolate', 'Hello everyone');
|
||||
break;
|
||||
default:
|
||||
throw new Error('Called too many times! ' + JSON.stringify(changes));
|
||||
@ -381,7 +384,7 @@ export function main() {
|
||||
}).Class({constructor: function() {}});
|
||||
|
||||
const element = html(`<div>
|
||||
<ng2 literal="Text" interpolate="Hello {{'world'}}"
|
||||
<ng2 literal="Text" interpolate="Hello {{name}}"
|
||||
bind-one-way-a="dataA" [one-way-b]="dataB"
|
||||
bindon-two-way-a="modelA" [(two-way-b)]="modelB"
|
||||
on-event-a='eventA=$event' (event-b)="eventB=$event"></ng2>
|
||||
@ -394,6 +397,15 @@ export function main() {
|
||||
'literal: Text; interpolate: Hello world; ' +
|
||||
'oneWayA: A; oneWayB: B; twoWayA: newA; twoWayB: newB; (2) | ' +
|
||||
'modelA: newA; modelB: newB; eventA: aFired; eventB: bFired;');
|
||||
|
||||
ref.ng1RootScope.$apply('name = "everyone"');
|
||||
expect(multiTrim(document.body.textContent))
|
||||
.toEqual(
|
||||
'ignore: -; ' +
|
||||
'literal: Text; interpolate: Hello everyone; ' +
|
||||
'oneWayA: A; oneWayB: B; twoWayA: newA; twoWayB: newB; (3) | ' +
|
||||
'modelA: newA; modelB: newB; eventA: aFired; eventB: bFired;');
|
||||
|
||||
ref.dispose();
|
||||
});
|
||||
|
||||
@ -491,6 +503,39 @@ export function main() {
|
||||
});
|
||||
}));
|
||||
|
||||
it('should correctly project structural directives', async(() => {
|
||||
@Component({selector: 'ng2', template: 'ng2-{{ itemId }}(<ng-content></ng-content>)'})
|
||||
class Ng2Component {
|
||||
@Input() itemId: string;
|
||||
}
|
||||
|
||||
@NgModule({imports: [BrowserModule], declarations: [Ng2Component]})
|
||||
class Ng2Module {
|
||||
}
|
||||
|
||||
const adapter: UpgradeAdapter = new UpgradeAdapter(Ng2Module);
|
||||
const ng1Module = angular.module('ng1', [])
|
||||
.directive('ng2', adapter.downgradeNg2Component(Ng2Component))
|
||||
.run(($rootScope: angular.IRootScopeService) => {
|
||||
$rootScope['items'] = [
|
||||
{id: 'a', subitems: [1, 2, 3]}, {id: 'b', subitems: [4, 5, 6]},
|
||||
{id: 'c', subitems: [7, 8, 9]}
|
||||
];
|
||||
});
|
||||
|
||||
const element = html(`
|
||||
<ng2 ng-repeat="item in items" [item-id]="item.id">
|
||||
<div ng-repeat="subitem in item.subitems">{{ subitem }}</div>
|
||||
</ng2>
|
||||
`);
|
||||
|
||||
adapter.bootstrap(element, [ng1Module.name]).ready(ref => {
|
||||
expect(multiTrim(document.body.textContent))
|
||||
.toBe('ng2-a( 123 )ng2-b( 456 )ng2-c( 789 )');
|
||||
ref.dispose();
|
||||
});
|
||||
}));
|
||||
|
||||
it('should allow attribute selectors for components in ng2', async(() => {
|
||||
const adapter: UpgradeAdapter = new UpgradeAdapter(forwardRef(() => MyNg2Module));
|
||||
const ng1Module = angular.module('myExample', []);
|
||||
@ -1901,14 +1946,17 @@ function multiTrim(text: string): string {
|
||||
}
|
||||
|
||||
function html(html: string): Element {
|
||||
// Don't return `body` itself, because using it as a `$rootElement` for ng1
|
||||
// will attach `$injector` to it and that will affect subsequent tests.
|
||||
const body = document.body;
|
||||
body.innerHTML = html;
|
||||
body.innerHTML = `<div>${html.trim()}</div>`;
|
||||
const div = document.body.firstChild as Element;
|
||||
|
||||
if (body.childNodes.length == 1 && body.firstChild instanceof HTMLElement) {
|
||||
return <Element>body.firstChild;
|
||||
if (div.childNodes.length === 1 && div.firstChild instanceof HTMLElement) {
|
||||
return div.firstChild;
|
||||
}
|
||||
|
||||
return body;
|
||||
return div;
|
||||
}
|
||||
|
||||
function nodes(html: string) {
|
||||
|
@ -1,6 +1,6 @@
|
||||
{
|
||||
"name": "angular-srcs",
|
||||
"version": "2.4.7",
|
||||
"version": "2.4.9",
|
||||
"private": true,
|
||||
"branchPattern": "2.0.*",
|
||||
"description": "Angular 2 - a web framework for modern web apps",
|
||||
|
@ -2,9 +2,10 @@
|
||||
|
||||
set -e -o pipefail
|
||||
|
||||
echo 'travis_fold:start:ENV'
|
||||
|
||||
NODE_VERSION=5.4.1
|
||||
NPM_VERSION=3.5.3
|
||||
NODE_VERSION=6.9.5
|
||||
NPM_VERSION=3.10.7 # do not upgrade to >3.10.8 unless https://github.com/npm/npm/issues/14042 is resolved
|
||||
CHROMIUM_VERSION=403382 # Chrome 53 linux stable, see https://www.chromium.org/developers/calendar
|
||||
SAUCE_CONNECT_VERSION=4.3.11
|
||||
|
||||
@ -74,3 +75,4 @@ if [[ ${TRAVIS} ]]; then
|
||||
export CHROME_BIN=${HOME}/.chrome/chromium/chrome-linux/chrome
|
||||
fi
|
||||
|
||||
echo 'travis_fold:end:ENV'
|
||||
|
@ -2,6 +2,29 @@
|
||||
set -e -x
|
||||
|
||||
|
||||
# Find the most recent tag that is reachable from the current commit.
|
||||
# This is shallow clone of the repo, so we might need to fetch more commits to
|
||||
# find the tag.
|
||||
function getLatestTag {
|
||||
local depth=`git log --oneline | wc -l`
|
||||
local latestTag=`git describe --tags --abbrev=0 || echo NOT_FOUND`
|
||||
|
||||
while [ "$latestTag" == "NOT_FOUND" ]; do
|
||||
# Avoid infinite loop.
|
||||
if [ "$depth" -gt "1000" ]; then
|
||||
echo "Error: Unable to find the latest tag." 1>&2
|
||||
exit 1;
|
||||
fi
|
||||
|
||||
# Increase the clone depth and look for a tag.
|
||||
depth=$((depth + 50))
|
||||
git fetch --depth=$depth
|
||||
latestTag=`git describe --tags --abbrev=0 || echo NOT_FOUND`
|
||||
done
|
||||
|
||||
echo $latestTag;
|
||||
}
|
||||
|
||||
function publishRepo {
|
||||
COMPONENT=$1
|
||||
ARTIFACTS_DIR=$2
|
||||
@ -88,7 +111,7 @@ function publishPackages {
|
||||
COMMIT_MSG=`git log --oneline | head -n1`
|
||||
COMMITTER_USER_NAME=`git --no-pager show -s --format='%cN' HEAD`
|
||||
COMMITTER_USER_EMAIL=`git --no-pager show -s --format='%cE' HEAD`
|
||||
LATEST_TAG=`git describe --tags --abbrev=0`
|
||||
LATEST_TAG=`getLatestTag`
|
||||
|
||||
publishRepo "${COMPONENT}" "${JS_BUILD_ARTIFACTS_DIR}"
|
||||
done
|
||||
|
6
tools/public_api_guard/http/index.d.ts
vendored
6
tools/public_api_guard/http/index.d.ts
vendored
@ -191,14 +191,14 @@ export declare class ResponseOptions {
|
||||
}
|
||||
|
||||
/** @experimental */
|
||||
export declare type ResponseOptionsArgs = {
|
||||
export interface ResponseOptionsArgs {
|
||||
body?: string | Object | FormData | ArrayBuffer | Blob;
|
||||
headers?: Headers;
|
||||
status?: number;
|
||||
statusText?: string;
|
||||
headers?: Headers;
|
||||
type?: ResponseType;
|
||||
url?: string;
|
||||
};
|
||||
}
|
||||
|
||||
/** @experimental */
|
||||
export declare enum ResponseType {
|
||||
|
@ -18,7 +18,7 @@ cp -R -v tools/typings-test/* $TMP
|
||||
# create package.json so that npm install doesn't pollute any parent node_modules's directory
|
||||
npm init --yes
|
||||
npm install ${LINKABLE_PKGS[*]}
|
||||
npm install @types/es6-promise @types/es6-collections @types/jasmine rxjs@5.0.0-beta.11
|
||||
npm install @types/es6-promise@0.0.32 @types/es6-collections@0.5.29 @types/jasmine@2.5.41 rxjs@5.0.0-beta.11
|
||||
npm install typescript@1.8.10
|
||||
$(npm bin)/tsc --version
|
||||
$(npm bin)/tsc -p tsconfig.json
|
||||
|
Reference in New Issue
Block a user