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
35
ASP.NET Core – Deep Dive on Building a Real Website
shravan
0
38
Cross-Platform Mobile Development using Visual Studio and Xamarin
shravan
1
38
Building Next Generation Web Apps and Services using ASP.NET 5
shravan
0
88
Writing Application-Scale JavaScript:TypeScript
shravan
0
54
Running, improving and maintaining a site in the real world
shravan
0
35
Real-time Communications with SignalR
shravan
0
47
Open Web Interface for .NET
shravan
0
140
Glance at Visual Studio 2013 ASP.NET and Web Tools 2013
shravan
0
72
Other Decks in Programming
See All in Programming
Lottieアニメーションをカスタマイズしてみた
tahia910
0
120
Compose でデザインと実装の差異を減らすための取り組み
oidy
1
300
DROBEの生成AI活用事例 with AWS
ippey
0
130
2,500万ユーザーを支えるSREチームの6年間のスクラムのカイゼン
honmarkhunt
6
5.2k
Amazon S3 TablesとAmazon S3 Metadataを触ってみた / 20250201-jawsug-tochigi-s3tables-s3metadata
kasacchiful
0
120
Conform を推す - Advocating for Conform
mizoguchicoji
3
690
Boost Performance and Developer Productivity with Jakarta EE 11
ivargrimstad
0
120
昭和の職場からアジャイルの世界へ
kumagoro95
1
360
もう僕は OpenAPI を書きたくない
sgash708
3
990
Grafana Loki によるサーバログのコスト削減
mot_techtalk
1
120
『品質』という言葉が嫌いな理由
korimu
0
160
Amazon ECS とマイクロサービスから考えるシステム構成
hiyanger
2
520
Featured
See All Featured
The Invisible Side of Design
smashingmag
299
50k
What's in a price? How to price your products and services
michaelherold
244
12k
Testing 201, or: Great Expectations
jmmastey
42
7.2k
Docker and Python
trallard
44
3.3k
Designing on Purpose - Digital PM Summit 2013
jponch
117
7.1k
Product Roadmaps are Hard
iamctodd
PRO
50
11k
Save Time (by Creating Custom Rails Generators)
garrettdimon
PRO
29
1k
Making Projects Easy
brettharned
116
6k
GraphQLの誤解/rethinking-graphql
sonatard
68
10k
10 Git Anti Patterns You Should be Aware of
lemiorhan
PRO
656
59k
Automating Front-end Workflow
addyosmani
1367
200k
RailsConf 2023
tenderlove
29
1k
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