Angular New Router

Transcript

1. ANGULAR NEW ROUTER
2. TOMOYUKI KASHIRO Twitter : @Tkashiro Github : @kashiro Freelance Web Front-end Developer
3. http://goo.gl/MpnOiM
4. BASIC USAGE
5. DIRECTORY There is no way to change components (html and javascript) path in the settings.
6. CONTROLLER app.js
7. COMPONENTS component/home/home.js
8. COMPONENTS component/home/home.html
9. HTML index.html ng-link=“home” : href=“/“ ng-link=“detail({id: ‘hoge’})” : href=“/detail/hoge“
10. NG-LINK
11. RESULT
12. SIBLING USAGE
13. SETTING Navigation Area Contents Area
14. /index.html Home Nav Home Contents
15. /detail/index.html Detail Nav Detail Contents
16. RESULT LEFT
 CONTENT RIGHT
 CONTENT
17. RESULT
18. HTML index.html
19. CONTROLLER
20. RESULT
21. OTHER USAGE
22. 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
23. SUMMARY
24. • still have some inconvenient things. • new router is still developing… • It will be useful to controlling routing. i think. • Let’s contribute :)