如何友好的啟動Angular應用

angular應用的index.html會在文件當中寫入根元件，例如：

直到angular初始化完成後 loading... 字樣才會從頁面消失，並進入實際的應用。當然相比較一版空白著實還算優雅一點。

然而乙個好的應用的體驗怎能這樣呢，有興趣的可以先看一下 ng-alain 是如何友好的啟動angular的。

對於angular而言，真正開始渲染元件會在platformbrowserdynamic().bootstrapmodule之後，因此若說友好，理應在此之前把那該死的 loading... 換成乙個動畫或更友好的效果。

所以，得出第乙個要點：盡可能早顯示啟動動畫，並盡可能在元件渲染之前關掉動畫。

然而，現實與想法的有點不同，那就是絕大部分啟動過程中是需要依賴於遠端資料，亦或者指引使用者應該是進入登入頁，還是控制頁。

因此，第二個要點：啟動前需要至少一次遠端互動。

●●

●●●●

const bootstrap = () => ;

bootstrap().then(() => );

一種非常理所當然的想法便是在bootstrapmodule之間傳送ajax請求不就可以了。話雖簡單，那ajax**怎麼寫？是不是還得考慮相容性問題？遠端資料載入後難道用window.***來儲存嗎？

若你這麼做，那你太小看angular，angular是非常強大的。

所以只需要像其它服務編碼一樣，寫乙個用於在啟動應用時所需要的服務邏輯，以下是一摘自 ng-alain：

/** * 用於應用啟動時

* 一般用來獲取應用所需要的基礎資料等

*/@injectable()

export class startupservice

load(): promise)

.catch((err: any) => );

return ret.then((res) => );

}}這裡有兩點需要注意：

服務是需要註冊的，自然在根模組中完成。

export function startupservicefactory(startupservice: startupservice): function ;

}@ngmodule(
],})

希望此文能幫助各位。

專案應如何啟動

描述 某經營鋼材產品的公司，近幾年業務得到了成倍的發展，原來採用手工處理業務的方式此時顯得力不從心。因此，經過公司董事會的決定，在公司推行一套管理軟體來替代原有的手工作業的方式，同時，請公司的副總負責此專案的啟動工作。副總接到任務後，隨即開始了專案的啟動工作。專案經過前期的一些工作後，副總任命小胡為...

譯 如何手動啟動 Angular 程式

angular 官方文件寫到，為了啟動 angular 程式，必須在main.ts檔案裡寫上如下 這行 platformbrowserdynamic 是為了構造乙個platform，angular 官方文件對platform的定義是 譯者注 為清晰理解，platform定義不翻譯 ngmodule ...

Angular的啟動過程

main.ts 是啟動的起點，platformbrowserdynamic這個函式是瀏覽器平台的工廠函式,執行會返回瀏覽器平台的例項，然後對根模組進行初始化，鏈式的將所有的依賴的module都給載入進來。每個應用程式都是通過模組的using bootstrapmodule方法 建立的。import ...