SlideShare ist ein Scribd-Unternehmen logo
1
Component Router
für Angular 1.x und 2.0
Manfred Steyer
ManfredSteyer
Inhalt
Überblick zu Routing
Stand der Dinge
Component Router
DEMO
Lifecycle-Hooks
DEMO
Page  3
2
ÜBERBLICK ZU ROUTING
Page  4
Motivation
 SPAs bestehen aus einer Seite
 Innerhalb dieser werden Bereiche ein- und
ausgeblendet --> "Logische Seiten"
 Herausforderungen:
 Bookmarks
 Back-Button
 Eigene Datei pro logischer Seite --> Übersicht
Page  5
3
Routing
 Logische Seiten erhalten eine URL, z. B:
 /FlugDemo#flugbuchen/passagier
 /FlugDemo#flugbuchen/flug
 Logische Seiten erhalten URL-Parameter, z. B.:
 /FlugDemo#flugbuchen/passagier/5
Page  6
Routing
Page  7
Logo + Menü
Menü2
Fußzeile
SPA
Platzhalter
4
Routing
Page  8
Logo + Menü
Menü2
Fußzeile
SPA
Passagier.html
/FlugDemo#flugbuchen/passagier
Weitere Möglichkeiten
Hierarchische Views
Multi-Views
Page  9
5
HIERARCHISCHE VIEWS
Page  10
Hierarchische Views
Page  11
Logo + Menü
Menü2
Fußzeile
SPA
Platzhalter 1
6
Hierarchische Views
Page  12
Logo + Menü
Menü2
Fußzeile
SPA
/FlugDemo#flugbuchen
flugbuchen.html
Hierarchische Views
Page  13
Logo + Menü
Menü2
Fußzeile
SPA
/FlugDemo#flugbuchen
Optionen
flugbuchen.html
Platzhalter
7
Hierarchische Views
Page  14
Logo + Menü
Menü2
Fußzeile
SPA
/FlugDemo#flugbuchen/passagier
Optionen
flugbuchen.html
Passagier.html
MULTIPLE VIEWS
Page  15
8
Multiple Views
Page  16
Logo + Menü
Menü2
Fußzeile
SPA
Platzhalter 1
Platzhalter 2
Multiple Views
Page  17
Logo + Menü
Menü2
Fußzeile
SPA
Passagier.html
Passagier-Links.html
/FlugDemo#flugbuchen/passagier
9
STAND DER DINGE
Page  18
ngRoute
Routing-Modul in AngularJS
Nur für einfache Use-Cases gedacht
Kein hierarchisches Routing
Keine Multi-Views
Page  19
10
UI-Router
Freies Community-Projekt
Defakto Standard
Unterstützt alle bis dato betrachteten
Szenarien für AngularJS 1.x
Auch: Hierarchische Views und Multi-Views
Page  20
COMPONENT ROUTER
Page  21
11
Überblick
Unterstützt die bisher betrachteten Szenarien
Convention over Configuration
Unterstützt sowohl AngularJS 1.x als auch
Angular 2 side-by-side
„Schleichende“ Migrationsstrategie
Page  22
Komponenten
 Ziel einer Route --> Komponente
 Komponente in Angular 1.x:
Controller + Template
 Konvention für Controller: XYController
 Konvention für Template: xy/xy.html
 Konvention für Controller-Instanz: xy
 Konfigurieren: $componentLoaderProvider
Page  23
12
Entwicklungsstand und Installation
Noch in Entwicklung!!
Hier vorgestellte Version: 0.5.x
Soll mit Angular 1.5 kommen
Installation: npm install angular-new-router
Page  24
Künftige Features
Navigation-Model
Lazy Loading
Page  25
13
DEMO
Page  26
LIFECYCLE HOOKS
Page  27
14
Hooks auf Controller-Ebene
canActivate
activate
canDeactivate
deactivate
Page  28
DEMO
Page  29
15
Zusammenfassung
Angular 1.x und 2 side-by-side
Schleichende Migration
Konventionen
Hierarchische Views und Multi-Views
Life-Cycle Hooks
Page  30

Weitere ähnliche Inhalte

Ähnlich wie Modern angular 04_component_router

Angular 2: Routing
Angular 2: RoutingAngular 2: Routing
Angular 2: Routing
Manfred Steyer
 
Angular 2 Workshop November 2015 von der w-jax 2015
Angular 2 Workshop November 2015 von der w-jax 2015Angular 2 Workshop November 2015 von der w-jax 2015
Angular 2 Workshop November 2015 von der w-jax 2015
Manfred Steyer
 
Angular 2 Workshop Oktober 2015
Angular 2 Workshop Oktober 2015Angular 2 Workshop Oktober 2015
Angular 2 Workshop Oktober 2015
Manfred Steyer
 
Überblick zu Angular2 auf DevCon der Fox-Pro-Usergroup in Frankfurt, Nov 2015
Überblick zu Angular2 auf DevCon der Fox-Pro-Usergroup in Frankfurt, Nov 2015Überblick zu Angular2 auf DevCon der Fox-Pro-Usergroup in Frankfurt, Nov 2015
Überblick zu Angular2 auf DevCon der Fox-Pro-Usergroup in Frankfurt, Nov 2015
Manfred Steyer
 
.NET Summit 2016 München: Angular 2 mit TypeScript
.NET Summit 2016 München: Angular 2 mit TypeScript.NET Summit 2016 München: Angular 2 mit TypeScript
.NET Summit 2016 München: Angular 2 mit TypeScript
Manfred Steyer
 
Angular 2 Überblick Oktober 2015
Angular 2 Überblick Oktober 2015Angular 2 Überblick Oktober 2015
Angular 2 Überblick Oktober 2015
Manfred Steyer
 
Django - The Web framework for perfectionists with deadlines
Django - The Web framework for perfectionists with deadlinesDjango - The Web framework for perfectionists with deadlines
Django - The Web framework for perfectionists with deadlines
Markus Zapke-Gründemann
 
Entwickeln mit Wordpress
Entwickeln mit WordpressEntwickeln mit Wordpress
Entwickeln mit Wordpress
Blogwerk AG
 
Web APIs mit ASP.NET Core 1
Web APIs mit ASP.NET Core 1Web APIs mit ASP.NET Core 1
Web APIs mit ASP.NET Core 1
Manfred Steyer
 
JCON 2021: Turbo powered Web Apps
JCON 2021: Turbo powered Web AppsJCON 2021: Turbo powered Web Apps
JCON 2021: Turbo powered Web Apps
Jan Stamer
 
Karlsruher Entwicklertag 2021: Turbo powered Web Apps
Karlsruher Entwicklertag 2021: Turbo powered Web AppsKarlsruher Entwicklertag 2021: Turbo powered Web Apps
Karlsruher Entwicklertag 2021: Turbo powered Web Apps
Jan Stamer
 
HTML5 - presentation at W3C-Tag 2009
HTML5 - presentation at W3C-Tag 2009HTML5 - presentation at W3C-Tag 2009
HTML5 - presentation at W3C-Tag 2009
Felix Sasaki
 
AndroMDA - Einführung in eine Open Source Model Driven Architecture Lösung
AndroMDA - Einführung in eine Open Source Model Driven Architecture LösungAndroMDA - Einführung in eine Open Source Model Driven Architecture Lösung
AndroMDA - Einführung in eine Open Source Model Driven Architecture Lösung
Eduard Hildebrandt
 
Angular 2: Neuerungen und Migration
Angular 2: Neuerungen und MigrationAngular 2: Neuerungen und Migration
Angular 2: Neuerungen und Migration
Manfred Steyer
 
TYPO3 CMS 7.5 - Die Neuerungen - pluswerk
TYPO3 CMS 7.5 - Die Neuerungen - pluswerkTYPO3 CMS 7.5 - Die Neuerungen - pluswerk
TYPO3 CMS 7.5 - Die Neuerungen - pluswerk
die.agilen GmbH
 
Einführung in die Java-Webentwicklung - Part II - [3 of 3] - Java Server Face...
Einführung in die Java-Webentwicklung - Part II - [3 of 3] - Java Server Face...Einführung in die Java-Webentwicklung - Part II - [3 of 3] - Java Server Face...
Einführung in die Java-Webentwicklung - Part II - [3 of 3] - Java Server Face...
kaftanenko
 

Ähnlich wie Modern angular 04_component_router (16)

Angular 2: Routing
Angular 2: RoutingAngular 2: Routing
Angular 2: Routing
 
Angular 2 Workshop November 2015 von der w-jax 2015
Angular 2 Workshop November 2015 von der w-jax 2015Angular 2 Workshop November 2015 von der w-jax 2015
Angular 2 Workshop November 2015 von der w-jax 2015
 
Angular 2 Workshop Oktober 2015
Angular 2 Workshop Oktober 2015Angular 2 Workshop Oktober 2015
Angular 2 Workshop Oktober 2015
 
Überblick zu Angular2 auf DevCon der Fox-Pro-Usergroup in Frankfurt, Nov 2015
Überblick zu Angular2 auf DevCon der Fox-Pro-Usergroup in Frankfurt, Nov 2015Überblick zu Angular2 auf DevCon der Fox-Pro-Usergroup in Frankfurt, Nov 2015
Überblick zu Angular2 auf DevCon der Fox-Pro-Usergroup in Frankfurt, Nov 2015
 
.NET Summit 2016 München: Angular 2 mit TypeScript
.NET Summit 2016 München: Angular 2 mit TypeScript.NET Summit 2016 München: Angular 2 mit TypeScript
.NET Summit 2016 München: Angular 2 mit TypeScript
 
Angular 2 Überblick Oktober 2015
Angular 2 Überblick Oktober 2015Angular 2 Überblick Oktober 2015
Angular 2 Überblick Oktober 2015
 
Django - The Web framework for perfectionists with deadlines
Django - The Web framework for perfectionists with deadlinesDjango - The Web framework for perfectionists with deadlines
Django - The Web framework for perfectionists with deadlines
 
Entwickeln mit Wordpress
Entwickeln mit WordpressEntwickeln mit Wordpress
Entwickeln mit Wordpress
 
Web APIs mit ASP.NET Core 1
Web APIs mit ASP.NET Core 1Web APIs mit ASP.NET Core 1
Web APIs mit ASP.NET Core 1
 
JCON 2021: Turbo powered Web Apps
JCON 2021: Turbo powered Web AppsJCON 2021: Turbo powered Web Apps
JCON 2021: Turbo powered Web Apps
 
Karlsruher Entwicklertag 2021: Turbo powered Web Apps
Karlsruher Entwicklertag 2021: Turbo powered Web AppsKarlsruher Entwicklertag 2021: Turbo powered Web Apps
Karlsruher Entwicklertag 2021: Turbo powered Web Apps
 
HTML5 - presentation at W3C-Tag 2009
HTML5 - presentation at W3C-Tag 2009HTML5 - presentation at W3C-Tag 2009
HTML5 - presentation at W3C-Tag 2009
 
AndroMDA - Einführung in eine Open Source Model Driven Architecture Lösung
AndroMDA - Einführung in eine Open Source Model Driven Architecture LösungAndroMDA - Einführung in eine Open Source Model Driven Architecture Lösung
AndroMDA - Einführung in eine Open Source Model Driven Architecture Lösung
 
Angular 2: Neuerungen und Migration
Angular 2: Neuerungen und MigrationAngular 2: Neuerungen und Migration
Angular 2: Neuerungen und Migration
 
TYPO3 CMS 7.5 - Die Neuerungen - pluswerk
TYPO3 CMS 7.5 - Die Neuerungen - pluswerkTYPO3 CMS 7.5 - Die Neuerungen - pluswerk
TYPO3 CMS 7.5 - Die Neuerungen - pluswerk
 
Einführung in die Java-Webentwicklung - Part II - [3 of 3] - Java Server Face...
Einführung in die Java-Webentwicklung - Part II - [3 of 3] - Java Server Face...Einführung in die Java-Webentwicklung - Part II - [3 of 3] - Java Server Face...
Einführung in die Java-Webentwicklung - Part II - [3 of 3] - Java Server Face...
 

Mehr von Manfred Steyer

Datenbindung und Performance in Angular 2
Datenbindung und Performance in Angular 2Datenbindung und Performance in Angular 2
Datenbindung und Performance in Angular 2
Manfred Steyer
 
Single Page Applications neu gedacht: Redux in Angular 2 mit @ngrx/store
Single Page Applications neu gedacht: Redux in Angular 2 mit @ngrx/storeSingle Page Applications neu gedacht: Redux in Angular 2 mit @ngrx/store
Single Page Applications neu gedacht: Redux in Angular 2 mit @ngrx/store
Manfred Steyer
 
Offlinefähige Browseranwendungen: Progressive Web-Apps mit Angular 2
Offlinefähige Browseranwendungen: Progressive Web-Apps mit Angular 2Offlinefähige Browseranwendungen: Progressive Web-Apps mit Angular 2
Offlinefähige Browseranwendungen: Progressive Web-Apps mit Angular 2
Manfred Steyer
 
Angular 2: Die Ideen hinter Datenbindung und Formularen im Detail betrachtet
Angular 2: Die Ideen hinter Datenbindung und Formularen im Detail betrachtetAngular 2: Die Ideen hinter Datenbindung und Formularen im Detail betrachtet
Angular 2: Die Ideen hinter Datenbindung und Formularen im Detail betrachtet
Manfred Steyer
 
Datengetriebene Web APIs mit Entity Framework
Datengetriebene Web APIs mit Entity FrameworkDatengetriebene Web APIs mit Entity Framework
Datengetriebene Web APIs mit Entity Framework
Manfred Steyer
 
Angular 2 Upgrade: Migration von AngularJS 1.x zu 2.0
Angular 2 Upgrade: Migration von AngularJS 1.x zu 2.0Angular 2 Upgrade: Migration von AngularJS 1.x zu 2.0
Angular 2 Upgrade: Migration von AngularJS 1.x zu 2.0
Manfred Steyer
 
The newst new Router for Angular 2 ("Version 3")
The newst new Router for Angular 2 ("Version 3")The newst new Router for Angular 2 ("Version 3")
The newst new Router for Angular 2 ("Version 3")
Manfred Steyer
 
Databinding and Performance-Tuning in Angular 2
Databinding and Performance-Tuning in Angular 2Databinding and Performance-Tuning in Angular 2
Databinding and Performance-Tuning in Angular 2
Manfred Steyer
 
Modern authentication solutions in Angular 2 with OAuth 2.0 and OpenId Connect
Modern authentication solutions in Angular 2 with OAuth 2.0 and OpenId ConnectModern authentication solutions in Angular 2 with OAuth 2.0 and OpenId Connect
Modern authentication solutions in Angular 2 with OAuth 2.0 and OpenId Connect
Manfred Steyer
 
Progressive web apps with Angular 2
Progressive web apps with Angular 2Progressive web apps with Angular 2
Progressive web apps with Angular 2
Manfred Steyer
 
Der neueste neue Router (Version 3) für Angular 2
Der neueste neue Router (Version 3) für Angular 2Der neueste neue Router (Version 3) für Angular 2
Der neueste neue Router (Version 3) für Angular 2
Manfred Steyer
 
Webpack
WebpackWebpack
ASP.NET Core 1 for MVC- and WebAPI-Devs
ASP.NET Core 1 for MVC- and WebAPI-DevsASP.NET Core 1 for MVC- and WebAPI-Devs
ASP.NET Core 1 for MVC- and WebAPI-Devs
Manfred Steyer
 
EF Core 1: News features and changes
EF Core 1: News features and changesEF Core 1: News features and changes
EF Core 1: News features and changes
Manfred Steyer
 
Angular 2: Migration - SSD 2016 London
Angular 2: Migration - SSD 2016 LondonAngular 2: Migration - SSD 2016 London
Angular 2: Migration - SSD 2016 London
Manfred Steyer
 
Angular 2 - SSD 2016 London
Angular 2 - SSD 2016 LondonAngular 2 - SSD 2016 London
Angular 2 - SSD 2016 London
Manfred Steyer
 
ASP.NET Web API Deep Dive - SSD 2016 London
ASP.NET Web API Deep Dive - SSD 2016 LondonASP.NET Web API Deep Dive - SSD 2016 London
ASP.NET Web API Deep Dive - SSD 2016 London
Manfred Steyer
 
Was bringt Angular 2?
Was bringt Angular 2?Was bringt Angular 2?
Was bringt Angular 2?
Manfred Steyer
 
Web APIs mit ASP.NET MVC Core 1
Web APIs mit ASP.NET MVC Core 1Web APIs mit ASP.NET MVC Core 1
Web APIs mit ASP.NET MVC Core 1
Manfred Steyer
 
.NET Summit 2016 München: EcmaScript 2015+ with TypeScript
.NET Summit 2016 München: EcmaScript 2015+ with TypeScript.NET Summit 2016 München: EcmaScript 2015+ with TypeScript
.NET Summit 2016 München: EcmaScript 2015+ with TypeScript
Manfred Steyer
 

Mehr von Manfred Steyer (20)

Datenbindung und Performance in Angular 2
Datenbindung und Performance in Angular 2Datenbindung und Performance in Angular 2
Datenbindung und Performance in Angular 2
 
Single Page Applications neu gedacht: Redux in Angular 2 mit @ngrx/store
Single Page Applications neu gedacht: Redux in Angular 2 mit @ngrx/storeSingle Page Applications neu gedacht: Redux in Angular 2 mit @ngrx/store
Single Page Applications neu gedacht: Redux in Angular 2 mit @ngrx/store
 
Offlinefähige Browseranwendungen: Progressive Web-Apps mit Angular 2
Offlinefähige Browseranwendungen: Progressive Web-Apps mit Angular 2Offlinefähige Browseranwendungen: Progressive Web-Apps mit Angular 2
Offlinefähige Browseranwendungen: Progressive Web-Apps mit Angular 2
 
Angular 2: Die Ideen hinter Datenbindung und Formularen im Detail betrachtet
Angular 2: Die Ideen hinter Datenbindung und Formularen im Detail betrachtetAngular 2: Die Ideen hinter Datenbindung und Formularen im Detail betrachtet
Angular 2: Die Ideen hinter Datenbindung und Formularen im Detail betrachtet
 
Datengetriebene Web APIs mit Entity Framework
Datengetriebene Web APIs mit Entity FrameworkDatengetriebene Web APIs mit Entity Framework
Datengetriebene Web APIs mit Entity Framework
 
Angular 2 Upgrade: Migration von AngularJS 1.x zu 2.0
Angular 2 Upgrade: Migration von AngularJS 1.x zu 2.0Angular 2 Upgrade: Migration von AngularJS 1.x zu 2.0
Angular 2 Upgrade: Migration von AngularJS 1.x zu 2.0
 
The newst new Router for Angular 2 ("Version 3")
The newst new Router for Angular 2 ("Version 3")The newst new Router for Angular 2 ("Version 3")
The newst new Router for Angular 2 ("Version 3")
 
Databinding and Performance-Tuning in Angular 2
Databinding and Performance-Tuning in Angular 2Databinding and Performance-Tuning in Angular 2
Databinding and Performance-Tuning in Angular 2
 
Modern authentication solutions in Angular 2 with OAuth 2.0 and OpenId Connect
Modern authentication solutions in Angular 2 with OAuth 2.0 and OpenId ConnectModern authentication solutions in Angular 2 with OAuth 2.0 and OpenId Connect
Modern authentication solutions in Angular 2 with OAuth 2.0 and OpenId Connect
 
Progressive web apps with Angular 2
Progressive web apps with Angular 2Progressive web apps with Angular 2
Progressive web apps with Angular 2
 
Der neueste neue Router (Version 3) für Angular 2
Der neueste neue Router (Version 3) für Angular 2Der neueste neue Router (Version 3) für Angular 2
Der neueste neue Router (Version 3) für Angular 2
 
Webpack
WebpackWebpack
Webpack
 
ASP.NET Core 1 for MVC- and WebAPI-Devs
ASP.NET Core 1 for MVC- and WebAPI-DevsASP.NET Core 1 for MVC- and WebAPI-Devs
ASP.NET Core 1 for MVC- and WebAPI-Devs
 
EF Core 1: News features and changes
EF Core 1: News features and changesEF Core 1: News features and changes
EF Core 1: News features and changes
 
Angular 2: Migration - SSD 2016 London
Angular 2: Migration - SSD 2016 LondonAngular 2: Migration - SSD 2016 London
Angular 2: Migration - SSD 2016 London
 
Angular 2 - SSD 2016 London
Angular 2 - SSD 2016 LondonAngular 2 - SSD 2016 London
Angular 2 - SSD 2016 London
 
ASP.NET Web API Deep Dive - SSD 2016 London
ASP.NET Web API Deep Dive - SSD 2016 LondonASP.NET Web API Deep Dive - SSD 2016 London
ASP.NET Web API Deep Dive - SSD 2016 London
 
Was bringt Angular 2?
Was bringt Angular 2?Was bringt Angular 2?
Was bringt Angular 2?
 
Web APIs mit ASP.NET MVC Core 1
Web APIs mit ASP.NET MVC Core 1Web APIs mit ASP.NET MVC Core 1
Web APIs mit ASP.NET MVC Core 1
 
.NET Summit 2016 München: EcmaScript 2015+ with TypeScript
.NET Summit 2016 München: EcmaScript 2015+ with TypeScript.NET Summit 2016 München: EcmaScript 2015+ with TypeScript
.NET Summit 2016 München: EcmaScript 2015+ with TypeScript
 

Modern angular 04_component_router

  • 1. 1 Component Router für Angular 1.x und 2.0 Manfred Steyer ManfredSteyer Inhalt Überblick zu Routing Stand der Dinge Component Router DEMO Lifecycle-Hooks DEMO Page  3
  • 2. 2 ÜBERBLICK ZU ROUTING Page  4 Motivation  SPAs bestehen aus einer Seite  Innerhalb dieser werden Bereiche ein- und ausgeblendet --> "Logische Seiten"  Herausforderungen:  Bookmarks  Back-Button  Eigene Datei pro logischer Seite --> Übersicht Page  5
  • 3. 3 Routing  Logische Seiten erhalten eine URL, z. B:  /FlugDemo#flugbuchen/passagier  /FlugDemo#flugbuchen/flug  Logische Seiten erhalten URL-Parameter, z. B.:  /FlugDemo#flugbuchen/passagier/5 Page  6 Routing Page  7 Logo + Menü Menü2 Fußzeile SPA Platzhalter
  • 4. 4 Routing Page  8 Logo + Menü Menü2 Fußzeile SPA Passagier.html /FlugDemo#flugbuchen/passagier Weitere Möglichkeiten Hierarchische Views Multi-Views Page  9
  • 5. 5 HIERARCHISCHE VIEWS Page  10 Hierarchische Views Page  11 Logo + Menü Menü2 Fußzeile SPA Platzhalter 1
  • 6. 6 Hierarchische Views Page  12 Logo + Menü Menü2 Fußzeile SPA /FlugDemo#flugbuchen flugbuchen.html Hierarchische Views Page  13 Logo + Menü Menü2 Fußzeile SPA /FlugDemo#flugbuchen Optionen flugbuchen.html Platzhalter
  • 7. 7 Hierarchische Views Page  14 Logo + Menü Menü2 Fußzeile SPA /FlugDemo#flugbuchen/passagier Optionen flugbuchen.html Passagier.html MULTIPLE VIEWS Page  15
  • 8. 8 Multiple Views Page  16 Logo + Menü Menü2 Fußzeile SPA Platzhalter 1 Platzhalter 2 Multiple Views Page  17 Logo + Menü Menü2 Fußzeile SPA Passagier.html Passagier-Links.html /FlugDemo#flugbuchen/passagier
  • 9. 9 STAND DER DINGE Page  18 ngRoute Routing-Modul in AngularJS Nur für einfache Use-Cases gedacht Kein hierarchisches Routing Keine Multi-Views Page  19
  • 10. 10 UI-Router Freies Community-Projekt Defakto Standard Unterstützt alle bis dato betrachteten Szenarien für AngularJS 1.x Auch: Hierarchische Views und Multi-Views Page  20 COMPONENT ROUTER Page  21
  • 11. 11 Überblick Unterstützt die bisher betrachteten Szenarien Convention over Configuration Unterstützt sowohl AngularJS 1.x als auch Angular 2 side-by-side „Schleichende“ Migrationsstrategie Page  22 Komponenten  Ziel einer Route --> Komponente  Komponente in Angular 1.x: Controller + Template  Konvention für Controller: XYController  Konvention für Template: xy/xy.html  Konvention für Controller-Instanz: xy  Konfigurieren: $componentLoaderProvider Page  23
  • 12. 12 Entwicklungsstand und Installation Noch in Entwicklung!! Hier vorgestellte Version: 0.5.x Soll mit Angular 1.5 kommen Installation: npm install angular-new-router Page  24 Künftige Features Navigation-Model Lazy Loading Page  25
  • 13. 13 DEMO Page  26 LIFECYCLE HOOKS Page  27
  • 15. 15 Zusammenfassung Angular 1.x und 2 side-by-side Schleichende Migration Konventionen Hierarchische Views und Multi-Views Life-Cycle Hooks Page  30