Upgrading AngularJS Part 3: Upgrading from AngularJS to Angular
Buy now
Learn more
Watch this First
Course Intro and Overview
Module 1: Setting Up ngUpgrade
Moving to ngUpgrade & Angular
Your Upgrade Roadmap Part 2
Documentation
Starting Point
Installing Angular
Fixing Two Errors
Renaming And Exporting app.ts
Angular Module
Angular Module Part 2
Adding main.ts
Webpack Entry And Running Hybrid App
Quiz: Module 1
Module 2: Rewriting & Downgrading Components
Rewriting Home Component
Decision About Downgrading
Downgrading Home Component
Finishing Home Component
Quiz: Module 2
Module 3: Rewriting & Downgrading Services
Adding http Module
Rewriting Customer Service
Converting To Promises
Downgrading Customer Service
Adding To ngModule
Quiz: Module 3
Module 4: Promises & Observables
Intro To RxJS Slides
Get Customers As Observable
Using Observable In Customer Component
Convert To Promise
Convert Promise To Observable
Quiz: Module 4
Module 5: Interfaces & Component Lifecycle Hooks
Rewriting Customers Table
Downgrading Customers Table
Updating Templates
Creating Customer Interface
Add Interface To Customer Table
Convert Customers
The OnInit Interface
Finish Customers Component
Module Wrap Up
Quiz: Module 5
Module 6: Upgrading Services
Where We're Going
Convert Orders Component
Add Properties
Finish Orders Component
Location Provider
Using Location In Component
Quiz: Module 6
Module 7: Rewriting Filters & Using Pipes
Updating Orders Template
Adding Sorting
Testing Sorting
Add Sort To Template
Add Styles
Add Filter To Component
Add Filter To Template
Fix Currency Pipe
Quiz: Module 7
Module 8: Forms
Convert Create Order
Provide Product Service
Downgrade Component
Add Forms Module
Convert Form Tag
Replace ng-model
Replace ng-options & ng-repeat
Required And Disabled
Validation Styling
Checking Out Our Validation
Posting an Observable
Assignment: Rewrite Customer Detail
Quiz: Module 8
Module 9: Upgrading Components
Rewrite Customer Detail
Upgrading Discount Component
Finish Discount Component
Quiz: Module 9
Module 10: ngUpgrade in Production
Current Bundle Size
Install Bundle Analyzer
Our Bundle And Angulars Two Modes
Fix RxJS Imports
Move Downgraded Components
Move Downgraded Services
Finishing Up The AJS Module
Adding AJS Entry
Changing Templates
Assignment: Finish Changing Templates
Removing Private Template Variables
Fix Export Defaults
Update Angular
Install AOT Tools
Add AOT TS Config
Main AOT File
Update Prod Config
Update Dev Config
Our New Builds
Quiz: Module 10
Module 11: Switching to Angular Router
Where We're At Now
Where We Need To Be
Adding Root Component
Creating Routing Module
Updating App Module
What's Working So Far
Replace $Location Service
Router Links
Adding Detail Routes
Creating A Resolver
Add Resolver To Routing Module
Use Resolved Data In Component
Order Detail Resolver
Use Order Detail Resolver
Use Interface In Component
Assignment: Product Detail Resolver
Product Detail Resolver
Fix Last Router Links
Quiz: Module 11
Module 12: Removing AngularJS
Move Imports
Remove AJS Refs And Files
Main Files And Webpack Entry
Remove AJS Packages
Our Finished Application
Quiz: Module 12
Module 13: Updating to Angular 5
Updating Packages
Using HttpClient to Module
Update Customer Service
Update Other Services
Remove Http Package
Fix Currency Pipe
Update Prod Config
Finish AOT Build
Module Wrap-Up
Quiz: Module 13
Module 14: RxJS 6 & Angular 6
Module Overview
Installing RxJS 6 Packages & Tools
Going Through the Updated Files
Fixing the Orders Component
Updating to Angular 6
Making Sure Everything Works
Quiz: Module 14
Module 15: Angular 7 & The CLI
Module Overview
Install Angular CLI
Creating a New Project
Add Dependencies
Move Files
Fix Styles
Configure Proxy
Delete Public Folder
Fix Dist Folder
Updating with the CLI
Module Wrap-Up
Quiz: Module 15
Products
Course
Section
Module 11: Switching to Angular Router
Module 11: Switching to Angular Router
Upgrading AngularJS Part 3: Upgrading from AngularJS to Angular
Buy now
Learn more
Watch this First
Course Intro and Overview
Module 1: Setting Up ngUpgrade
Moving to ngUpgrade & Angular
Your Upgrade Roadmap Part 2
Documentation
Starting Point
Installing Angular
Fixing Two Errors
Renaming And Exporting app.ts
Angular Module
Angular Module Part 2
Adding main.ts
Webpack Entry And Running Hybrid App
Quiz: Module 1
Module 2: Rewriting & Downgrading Components
Rewriting Home Component
Decision About Downgrading
Downgrading Home Component
Finishing Home Component
Quiz: Module 2
Module 3: Rewriting & Downgrading Services
Adding http Module
Rewriting Customer Service
Converting To Promises
Downgrading Customer Service
Adding To ngModule
Quiz: Module 3
Module 4: Promises & Observables
Intro To RxJS Slides
Get Customers As Observable
Using Observable In Customer Component
Convert To Promise
Convert Promise To Observable
Quiz: Module 4
Module 5: Interfaces & Component Lifecycle Hooks
Rewriting Customers Table
Downgrading Customers Table
Updating Templates
Creating Customer Interface
Add Interface To Customer Table
Convert Customers
The OnInit Interface
Finish Customers Component
Module Wrap Up
Quiz: Module 5
Module 6: Upgrading Services
Where We're Going
Convert Orders Component
Add Properties
Finish Orders Component
Location Provider
Using Location In Component
Quiz: Module 6
Module 7: Rewriting Filters & Using Pipes
Updating Orders Template
Adding Sorting
Testing Sorting
Add Sort To Template
Add Styles
Add Filter To Component
Add Filter To Template
Fix Currency Pipe
Quiz: Module 7
Module 8: Forms
Convert Create Order
Provide Product Service
Downgrade Component
Add Forms Module
Convert Form Tag
Replace ng-model
Replace ng-options & ng-repeat
Required And Disabled
Validation Styling
Checking Out Our Validation
Posting an Observable
Assignment: Rewrite Customer Detail
Quiz: Module 8
Module 9: Upgrading Components
Rewrite Customer Detail
Upgrading Discount Component
Finish Discount Component
Quiz: Module 9
Module 10: ngUpgrade in Production
Current Bundle Size
Install Bundle Analyzer
Our Bundle And Angulars Two Modes
Fix RxJS Imports
Move Downgraded Components
Move Downgraded Services
Finishing Up The AJS Module
Adding AJS Entry
Changing Templates
Assignment: Finish Changing Templates
Removing Private Template Variables
Fix Export Defaults
Update Angular
Install AOT Tools
Add AOT TS Config
Main AOT File
Update Prod Config
Update Dev Config
Our New Builds
Quiz: Module 10
Module 11: Switching to Angular Router
Where We're At Now
Where We Need To Be
Adding Root Component
Creating Routing Module
Updating App Module
What's Working So Far
Replace $Location Service
Router Links
Adding Detail Routes
Creating A Resolver
Add Resolver To Routing Module
Use Resolved Data In Component
Order Detail Resolver
Use Order Detail Resolver
Use Interface In Component
Assignment: Product Detail Resolver
Product Detail Resolver
Fix Last Router Links
Quiz: Module 11
Module 12: Removing AngularJS
Move Imports
Remove AJS Refs And Files
Main Files And Webpack Entry
Remove AJS Packages
Our Finished Application
Quiz: Module 12
Module 13: Updating to Angular 5
Updating Packages
Using HttpClient to Module
Update Customer Service
Update Other Services
Remove Http Package
Fix Currency Pipe
Update Prod Config
Finish AOT Build
Module Wrap-Up
Quiz: Module 13
Module 14: RxJS 6 & Angular 6
Module Overview
Installing RxJS 6 Packages & Tools
Going Through the Updated Files
Fixing the Orders Component
Updating to Angular 6
Making Sure Everything Works
Quiz: Module 14
Module 15: Angular 7 & The CLI
Module Overview
Install Angular CLI
Creating a New Project
Add Dependencies
Move Files
Fix Styles
Configure Proxy
Delete Public Folder
Fix Dist Folder
Updating with the CLI
Module Wrap-Up
Quiz: Module 15
19 Lessons
Where We're At Now
Where We Need To Be
Adding Root Component
Creating Routing Module
Updating App Module
What's Working So Far
Replace $Location Service
Router Links
Adding Detail Routes
Creating A Resolver
Add Resolver To Routing Module
Use Resolved Data In Component
Order Detail Resolver
Use Order Detail Resolver
Use Interface In Component
Assignment: Product Detail Resolver
Product Detail Resolver
Fix Last Router Links
Quiz: Module 11