工具/材料

Sublime Text

操作方法

• 01

  首先在Sublime Text新建HTML頁面，然后導入angular.min.js和angular-route.js兩個腳本文件，如下圖所示

  
• 02

  然后在body標簽里添加ng-app屬性，這個屬性告訴angular從body開始全面監(jiān)聽元素動態(tài)，如下圖所示

  
• 03

  然后準備一個錨鏈接的列表，用于下面路由跳轉(zhuǎn)使用，如下圖所示

  
• 04

  接下來我們就需要在script標簽中通過module方法實例化angular了，注意實例化的時候添加ngRoute依賴，如下圖所示

  
• 05

  然后通過angular實例來實現(xiàn)config方法，如下圖所示，在config方法中傳入?yún)?shù)routeProvider

  
• 06

  接下來利用routeProvider中的when方法來匹配路徑，然后實現(xiàn)路由跳轉(zhuǎn)，如下圖所示

  
• 07

  最后我們運行頁面，你會看到如下圖所示的展示，當你點擊某個連接的時候，你會發(fā)現(xiàn)地址欄的連接也會跟著變得