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
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
The Past, Present, and Future of Enterprise Java
ivargrimstad
0
540
15年続くIoTサービスのSREエンジニアが挑む分散トレーシング導入
melonps
2
190
CSC307 Lecture 06
javiergs
PRO
0
680
16年目のピクシブ百科事典を支える最新の技術基盤 / The Modern Tech Stack Powering Pixiv Encyclopedia in its 16th Year
ahuglajbclajep
5
1k
余白を設計しフロントエンド開発を 加速させる
tsukuha
7
2.1k
[KNOTS 2026登壇資料]AIで拡張‧交差する プロダクト開発のプロセス および携わるメンバーの役割
hisatake
0
270
AIによるイベントストーミング図からのコード生成 / AI-powered code generation from Event Storming diagrams
nrslib
2
1.9k
メルカリのリーダビリティチームが取り組む、AI時代のスケーラブルな品質文化
cloverrose
2
510
なるべく楽してバックエンドに型をつけたい!(楽とは言ってない)
hibiki_cube
0
140
今から始めるClaude Code超入門
448jp
8
8.6k
AIエージェントのキホンから学ぶ「エージェンティックコーディング」実践入門
masahiro_nishimi
5
410
なぜSQLはAIぽく見えるのか/why does SQL look AI like
florets1
0
450
Featured
See All Featured
For a Future-Friendly Web
brad_frost
182
10k
Leveraging LLMs for student feedback in introductory data science courses - posit::conf(2025)
minecr
0
140
Faster Mobile Websites
deanohume
310
31k
Lessons Learnt from Crawling 1000+ Websites
charlesmeaden
PRO
1
1.1k
Accessibility Awareness
sabderemane
0
51
Bootstrapping a Software Product
garrettdimon
PRO
307
120k
Claude Code のすすめ
schroneko
67
210k
The SEO identity crisis: Don't let AI make you average
varn
0
67
The B2B funnel & how to create a winning content strategy
katarinadahlin
PRO
0
270
Unsuck your backbone
ammeep
671
58k
CSS Pre-Processors: Stylus, Less & Sass
bermonpainter
359
30k
The Illustrated Children's Guide to Kubernetes
chrisshort
51
51k
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