星期六, 6月 07, 2014

[AngularJS-3rd] UI-ROUTER 筆記

ng-router是angular一個非常強大的router框架,
可以利用state來架構頁面的切換
可以解決multiple-view的大型應用程式架構。
並可以避免頁面上重覆使用的元件(選單導航列、側邊欄選單等等)都要寫成directive元件的不便利性:D

操控多重View的關鍵技術

  • Nested States & Nested Views
https://github.com/angular-ui/ui-router/wiki/Nested-States-%26-Nested-Views

  • Multiple Named Views

其他範例

三個常用的ui-router tips
http://scotch.io/tutorials/javascript/3-simple-tips-for-using-ui-router

深度解析ng-router的功能
http://www.ng-newsletter.com/posts/angular-ui-router.html

簡單的ui-router nested view (view裡面還有一個view)範例https://egghead.io/lessons/angularjs-introduction-ui-router

複雜的multi-view的範例 (使用原生的router機制)
http://www.bennadel.com/blog/2441-nested-views-routing-and-deep-linking-with-angularjs.htm

混合Nested States & Nested Views 與 Multiple Named Views範例 (了解這個就OK了)
http://scotch.io/tutorials/javascript/angular-routing-using-ui-router

http://plnkr.co/edit/IzimSVsstarlFviAm7S7?p=preview

MEAN fullstack demo
https://github.com/DaftMonk/fullstack-demo

沒有留言:

張貼留言

留個話吧:)