Issue 1:
We have a requirement to destroy Angular2 Application when user is navigated to other page (Note: It is an application where we are using angular2 for one page only). So when the user navigates away from this page (using normal anchor), we have to unload/destroy the ng2 app.

we are taking applicationRef as follows:

platformBrowserDynamic([
{provide: 'ConfigService', useValue: {} }
]).bootstrapModule(AppModule).then((appModule:NgModuleRef<AppModule>)=>{
const appRef = appModule.injector.get(ApplicationRef);

if(!!callback)
callback(appRef);
});

we have a hook when user going out from this page, we are calling

_ref.components[0].hostView.destroy();

where _ref is the application reference passed in the callback above.

This entire flow calls the ngOnDestroy of each component inside the application however, when we navigate to non angular page, we can see that the components are still there in the memory and causing performance issue when I open the same page again.

https://ibb.co/nsjekk

You can see from the screenshot that the component are still present and consuming memory, even if we have destroyed the app as mentioned above.

What is the issue here. Is destroying application not enough to clear the memory? Or we are doing something wrong?

we are using Angular 2.1.2.

Issue 2:
[x] bug report => search github for a similar issue or PR before submitting
[] feature request on second thouth this is not a feature its definitive a bug
[ ] support request => Please do not submit support request here, instead see https://github.com/angular/angular/blob/master/CONTRIBUTING.md#question

Current behavior

See the following: #11606 (comment)

Expected behavior

The property template of component ComponentTemplateBase should get merged with

its child if the child is not specifying a template.

Minimal reproduction of the problem with instructions

See #11606 (comment)

What is the motivation / use case for changing the behavior?

Not having to duplicate settings across components when it is not needed.

Please tell us about your environment:

nodejs 6.6.0 package.js described here #11606 (comment)

Angular version: 2.0.X

2.4.1

Browser: [all | Chrome XX | Firefox XX | IE XX | Safari XX | Mobile Chrome XX | Android X.X Web Browser | iOS XX Safari | iOS XX UIWebView | iOS XX WKWebView ]

all

Language: [all | TypeScript X.X | ES6/7 | ES5]

all

Node (for AoT issues): node --version = 6.6.0

Copied comments from other issue to bellow:

@Component({
template: `<template [ngTemplateOutlet]="getTemplate()" [ngOutletContext]="{ $implicit: this }"></template>`
})
export abstract class ComponentTemplateBase implements ITemplateBase<DefaultViewState> {
@ContentChild(TemplateRef) defaultTemplate: TemplateRef<any>;
viewState: DefaultViewState = DefaultViewState.DefaultTemplate;

getTemplate(): TemplateRef<any> {
switch (this.viewState) {
case DefaultViewState.DefaultTemplate:
return this.defaultTemplate;
default:
return null;
}
}
}

and

@Component({
selector: "simple-login-form"
})
export class SimpleLoginFormComponent extends ComponentTemplateBase implements OnInit {
loginForm: FormGroup;
user: any;
memberStatus = MemberStatus;
status: MemberStatus;
payload: MemberPayload;

constructor(
@Inject(FormBuilder) private formBuilder: FormBuilder
)
{
super();
}

simpleLogin($event: Event) {
$event.preventDefault();
}

ngOnInit(): void {
this.loginForm = this.formBuilder.group({
username: ["", Validators.required],
password: ["", Validators.required],
remember: ["1"]
});
}
}

however angular cant find the "template" it is not inherited is this not supposed to work ?

im using latest version of angular as follows:

{
"dependencies": {
"@angular/common": "^2.4.1",
"@angular/compiler": "^2.4.1",
"@angular/core": "^2.4.1",
"@angular/forms": "^2.4.1",
"@angular/http": "^2.4.1",
"@angular/platform-browser": "^2.4.1",
"@angular/platform-browser-dynamic": "^2.4.1",
"@angular/router": "^3.4.1",
"angular-calendar": "^0.6.0",
"angular2-cookie": "^1.2.6",
"babel-runtime": "^6.20.0",
"core-js": "^2.4.1",
"date-fns": "^1.21.1",
"jquery": "^3.1.1",
"reflect-metadata": "^0.1.9",
"rxjs": "^5.0.2",
"scriptjs": "^2.5.8",
"zone.js": "^0.7.4"
},
"devDependencies": {
"@angularclass/hmr": "^1.2.2",
"@angularclass/hmr-loader": "^3.0.2",
"@types/bootstrap": "3.3.32",
"@types/core-js": "^0.9.35",
"@types/jasmine": "^2.5.38",
"@types/jquery": "^2.0.34",
"@types/node": "^6.0.53",
"@types/scriptjs": "^0.0.2",
"@types/selenium-webdriver": "^2.53.38",
"angular2-template-loader": "^0.6.0",
"autoprefixer": "^6.6.0",
"awesome-typescript-loader": "^3.0.0-beta.17",
"babel-core": "^6.21.0",
"babel-loader": "^6.2.10",
"babel-plugin-transform-runtime": "^6.15.0",
"babel-preset-es2015": "^6.18.0",
"bootstrap-loader": "^1.3.3",
"bootstrap-sass": "^3.3.7",
"browser-sync": "^2.18.5",
"browser-sync-webpack-plugin": "^1.1.3",
"bs-fullscreen-message": "^1.1.0",
"codelyzer": "^2.0.0-beta.4",
"compass-options": "^0.1.1",
"copy-webpack-plugin": "^4.0.1",
"css-loader": "^0.26.1",
"deep-extend": "^0.4.1",
"del": "^2.2.2",
"extract-text-webpack-plugin": "^1.0.1",
"file-loader": "^0.9.0",
"gulp": "^3.9.1",
"gulp-clean-css": "^2.0.13",
"gulp-compass": "^2.1.0",
"gulp-env": "^0.4.0",
"gulp-load-plugins": "^1.4.0",
"gulp-sequence": "^0.4.6",
"gulp-typescript": "^3.0.2",
"gulp-util": "^3.0.7",
"img-loader": "^1.3.1",
"imports-loader": "^0.7.0",
"lazy-object": "^1.0.1",
"load-gulp-tasks": "^0.1.0",
"ng2-bootstrap": "^1.1.16-9",
"ng2-facebook-sdk": "^1.1.0",
"node-sass": "^4.1.1",
"postcss-loader": "^1.2.1",
"progress-bar-webpack-plugin": "^1.9.1",
"raw-loader": "0.5.1",
"resolve-url-loader": "^1.6.1",
"sass-loader": "^4.1.1",
"source-map-loader": "^0.1.5",
"strip-ansi": "^3.0.1",
"style-loader": "^0.13.1",
"tslint": "^4.2.0",
"tslint-loader": "^3.3.0",
"typescript": "^2.1.4",
"url-loader": "^0.5.7",
"vinyl-named": "^1.1.0",
"webpack": "^2.2.0-rc.2",
"webpack-bundle-analyzer": "^2.1.1",
"webpack-dev-middleware": "^1.9.0",
"webpack-dev-server": "^2.2.0-rc.0",
"webpack-hot-middleware": "^2.14.0",
"webpack-merge": "^2.0.0",
"webpack-node-externals": "^1.5.4",
"webpack-stream": "3.2.0"
}
}