Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
Angular 2 with TypeScript
Search
Sponsored
·
Ship Features Fearlessly
Turn features on and off without deploys. Used by thousands of Ruby developers.
→
Shravan Kumar Kasagoni
February 27, 2016
Programming
1
160
Angular 2 with TypeScript
Building modern web apps using Angular 2 and TypeScript
Shravan Kumar Kasagoni
February 27, 2016
Tweet
Share
More Decks by Shravan Kumar Kasagoni
See All by Shravan Kumar Kasagoni
Functional Programming in JavaScript
shravan
0
37
ASP.NET Core – Deep Dive on Building a Real Website
shravan
0
42
Cross-Platform Mobile Development using Visual Studio and Xamarin
shravan
1
41
Building Next Generation Web Apps and Services using ASP.NET 5
shravan
0
89
Writing Application-Scale JavaScript:TypeScript
shravan
0
56
Running, improving and maintaining a site in the real world
shravan
0
37
Real-time Communications with SignalR
shravan
0
51
Open Web Interface for .NET
shravan
0
140
Glance at Visual Studio 2013 ASP.NET and Web Tools 2013
shravan
0
77
Other Decks in Programming
See All in Programming
MDN Web Docs に日本語翻訳でコントリビュート
ohmori_yusuke
0
640
余白を設計しフロントエンド開発を 加速させる
tsukuha
7
2.1k
メルカリのリーダビリティチームが取り組む、AI時代のスケーラブルな品質文化
cloverrose
2
510
AtCoder Conference 2025
shindannin
0
1k
【卒業研究】会話ログ分析によるユーザーごとの関心に応じた話題提案手法
momok47
0
190
Basic Architectures
denyspoltorak
0
660
責任感のあるCloudWatchアラームを設計しよう
akihisaikeda
3
160
AI & Enginnering
codelynx
0
110
カスタマーサクセス業務を変革したヘルススコアの実現と学び
_hummer0724
0
660
ぼくの開発環境2026
yuzneri
0
150
AI Agent Tool のためのバックエンドアーキテクチャを考える #encraft
izumin5210
6
1.8k
Oxlint JS plugins
kazupon
1
810
Featured
See All Featured
Data-driven link building: lessons from a $708K investment (BrightonSEO talk)
szymonslowik
1
910
Documentation Writing (for coders)
carmenintech
77
5.2k
Keith and Marios Guide to Fast Websites
keithpitt
413
23k
Principles of Awesome APIs and How to Build Them.
keavy
128
17k
コードの90%をAIが書く世界で何が待っているのか / What awaits us in a world where 90% of the code is written by AI
rkaga
60
42k
What’s in a name? Adding method to the madness
productmarketing
PRO
24
3.9k
Gemini Prompt Engineering: Practical Techniques for Tangible AI Outcomes
mfonobong
2
280
KATA
mclloyd
PRO
34
15k
Statistics for Hackers
jakevdp
799
230k
Discover your Explorer Soul
emna__ayadi
2
1.1k
The Illustrated Children's Guide to Kubernetes
chrisshort
51
51k
The Cult of Friendly URLs
andyhume
79
6.8k
Transcript
Angular 2.0 With Typescript
Your Speaker Shravan Kumar Kasagoni Senior Development Engineer @ Pramati
Technologies Microsoft MVP - Visual Studio and Development Technologies @techieshravan http://theshravan.net http://github.com/techieshravan
Agenda Angular 2.0 With Typescript
Language Choice ES5 ES6 TS Dart
Quick TypeScript Basics
Classes class Car { id: number; model: string; constructor(id: number,
model: string) { this.id = id; this.model = model; } showDetails() { console.log(this.id, this.model); } }
var car = new Car(100, 'Bentley GT Continental'); console.log(car.id); console.log(car.model);
car.showDetails(); Classes
Modules //car.ts export class Car { } //dashboard.ts class Dashboard
{ var car = new Car(100, 'Mustang'); } import {Car} from ‘./car’;
Angular 2 Basics
Components Template Directive Controller Component ng1 ng2
Component in TypeScript import {Component} from ‘angular2/core’; @Component({ selector: ‘’,
template: ‘’, styles: [] }) class AppComponent { }
Templates Bindings Example Properties <input [value]='userName'> Events <button (click)='showDetails($event)'> Two-way
<input [(ng-model)]='eMail'>
Demo time
Flipboard Magazines JavaScript Weekly : http://bit.ly/javascript-weekly The Angular 2 :
http://bit.ly/angular2-weekly
Resources http://angular.io http://theshravan.net
Reach Me Twitter : techieshravan Github : http://github.com/techieshravan Blog :
http://theshravan.net
Thank You