Yahoo奇摩以前推出「Yahoo奇摩部落格」和「無名小站」這兩項部落格平台,如今都已停止服務。現在若把部落格的相關網址直接貼到瀏覽器上並前往,我們最後會跑到Yahoo奇摩的首頁。
試想一下,若要瀏覽某個特定的東西,例如購物平台的商品,網址會有什麼不同?答案是網址後面會夾帶資料,像是商品編號或名稱,藉此對應想要瀏覽的東西。本課要練習的是在URL攜帶參數,取得特定的資料。
一個網站包含了許多網頁,而每個網頁有不同的網址。這一課要認識「路由」,學習如何定義URL與組件的對應關係,並利用超連結來顯示。
在上一課,我們把heroes組件顯示詳情的工作,交付給hero-detail組件負責,這是在html畫面的模組化。而本課要進行的是「程式」的模組化,利用「服務」這個角色,讓程式碼也可以重複使用。
在上一課,我們讓一個組件負責顯示清單和顯示詳情這兩件事。在大型專案中,這種做法會使人不容易維護。本課沒有要開發新的功能,而是要拆解上述的組件,讓每個組件只做特定的工作,達到模組化的目標。
使用手機App時,按下按鈕或清單上的項目,就會觸發新的動作,例如出現新畫面。而我們在第3課製作出了清單,這一課就讓網頁的清單項目在點擊時,也能夠有所反應。
第2課在html檔顯示了ts檔中的字串內容。這一課我們會在網頁中加入文字輸入框,體會Angular的「雙向綁定」特性。接著再加入清單,顯示多個hero物件。
Angular是一個網頁開發框架。除了能開發桌面版網頁,也能開發行動版的。甚至能打包成App在行動裝置上使用。這一節會安裝開發環境,並建立範例應用程式專案。