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 New Router
Search
Tomoyuki Kashiro
April 09, 2015
Programming
2
170
Angular New Router
Tomoyuki Kashiro
April 09, 2015
Tweet
Share
Other Decks in Programming
See All in Programming
Folding Cheat Sheet #2
philipschwarz
PRO
0
110
Changed Rules: Architectures with Lightweight Stores
manfredsteyer
PRO
0
230
Ruby Pattern Matching
bkuhlmann
0
920
PHPの次期バージョンはこの時期どうなっているのか - Internalsの開発体制について - PHPカンファレンス小田原
youkidearitai
PRO
1
180
コードレビューで学ぶ!Kotlinオブジェクト指向デザインパターン
akkie76
2
170
"config" ってなんだ? / What is "config"?
okashoi
0
210
1BRC--Nerd Sniping the Java Community
gunnarmorling
0
300
try! Swift Tokyo 初参加報告LT
hinakko2
0
190
コーンフレークから始める モデリング会話入門
ogurotakayuki
0
280
脱・初心者!脱・マネコン!AWS CDKを使ってみませんか!?
har1101
0
300
Front-end application development, Symfony-style(s)
dunglas
2
1.9k
スクラムガイドのスプリントレトロスペクティブを改めて読みかえしてみた / Re-reading the Sprint Retrospective Section in the Scrum Guide
mackey0225
3
320
Featured
See All Featured
It's Worth the Effort
3n
180
27k
Fight the Zombie Pattern Library - RWD Summit 2016
marcelosomers
226
16k
Building Effective Engineering Teams - LeadDev
addyosmani
27
1.8k
Rebuilding a faster, lazier Slack
samanthasiow
72
8.2k
Documentation Writing (for coders)
carmenintech
59
3.9k
Responsive Adventures: Dirty Tricks From The Dark Corners of Front-End
smashingmag
243
20k
Keith and Marios Guide to Fast Websites
keithpitt
408
22k
Designing for Performance
lara
602
67k
Product Roadmaps are Hard
iamctodd
43
9.7k
Fireside Chat
paigeccino
20
2.6k
The Cult of Friendly URLs
andyhume
74
5.7k
A Philosophy of Restraint
colly
196
16k
Transcript
ANGULAR NEW ROUTER
TOMOYUKI KASHIRO Twitter : @Tkashiro Github : @kashiro Freelance Web
Front-end Developer
http://goo.gl/MpnOiM
BASIC USAGE
DIRECTORY There is no way to change components (html and
javascript) path in the settings.
CONTROLLER app.js
COMPONENTS component/home/home.js
COMPONENTS component/home/home.html
HTML index.html ng-link=“home” : href=“/“ ng-link=“detail({id: ‘hoge’})” : href=“/detail/hoge“
NG-LINK
RESULT
SIBLING USAGE
SETTING Navigation Area Contents Area
/index.html Home Nav Home Contents
/detail/index.html Detail Nav Detail Contents
RESULT LEFT CONTENT RIGHT CONTENT
RESULT
HTML index.html
CONTROLLER
RESULT
OTHER USAGE
LIFE CYCLE HOOK You can hook routing life cycle (
e.g. activate / deactivate ) • Activate : useful to check login status • Deactivate : useful to check input validation
SUMMARY
• still have some inconvenient things. • new router is
still developing… • It will be useful to controlling routing. i think. • Let’s contribute :)