將Bootstrap主題/模板添加到Angular應用中

Question

我剛剛創建了Visual Studio 2017向導中提供的Angular＆Asp.Net Core模板。 然后，我下載了以下模板（精簡版）（ https://graygrids.com/item/classix-bootstrap-html5-classified-ads-listing-job-portal-web-template/） 。 但是，我不確定如何處理已下載的文件。 它包含一個稱為資產的文件夾（包含css，js等）和一堆html文件。

如何將該模板與Angular集成？

有關更多信息，請參見https://github.com/gf1721/Directory-ListingWebApp 。

為了澄清起見，我不是在談論Bootstrap CDN。

我在互聯網上看過，但令人驚訝的是，似乎沒有唯一的來源來解釋如何將主題與Angular集成。 這似乎也不是一個小問題。 我真的在這個上掙扎，幸好我還沒有買模板！

謝謝

Answer 1

您不能只復制一堆非Angular文件並將它們轉換為Angular項目。

最好的方法是開始為您的應用搭建所需的組件/路由，然后手動將模板代碼復制到組件中。 這並不是真正可以自動化的事情，如何決定將模板分解為組件將是您必須做出的設計決定。 只需將模板添加到您的項目中，然后在Angular中重建模板就可以了。

就基本代碼而言，只需將模板所需的任何Javascript / CSS依賴項添加到Angular中（在index.html中或使用Angular CLI的script選項）。 只需查找如何將Bootstrap 4添加到Angular Starter或CLI應用程序中，就可以開始使用。

另外，請注意，通常不希望將JQuery重接口元素添加到Angular項目中，因為您實際上是在使用兩個正交DOM操作系統。 我並不是說不要這樣做，但是當您嘗試綁定它們或通過Angular的DOM操作與它們進行交互時，您可能會發現模板中的元素不能很好地發揮作用。