如何在 angular 7 项目中集成 html 模板

Question

我正在 angular 7 项目中集成一个 html 模板，但它无法正常工作

我在 assets/template/.. 下添加了模板文件，并在 angular.json 中添加了导入，例如：

• "styles": ["src/assets/template/css/style-customizer.css",...],
• “脚本”：[“src/assets/template/js/vendor/modernizr-2.8.3.min.js”,...]

我编辑了 html 代码：

• 删除了 doctype 和 html 标签
• 删除了所有标题
• 删除了所有 css 和 js 导入
• 编辑图像来源

（如 src="/assets/template/img/slider/1.jpg" alt="main slider" title="#htmlcaption1"）

我在 app-root 标签下的 index.html 中添加了 html 代码并且一切正常

但是当我将其更改为 app.component.html 时：

• 有些图片没有显示
• 某些 css 无法正常工作
• 和一些动画不起作用

我的控制台没有任何错误

Answer 1

我通常不会在 angular.json 中使用 styles 数组，而是导入 styles .css 中的所有全局样式，因为默认情况下将其设置到 angular.json 样式数组中。

/* You can add global styles to this file, and also import other style files */

@import "assets/quote.css";

@import "https://fonts.googleapis.com/css?family=IBM+Plex+Sans+Condensed:200|Josefin+Sans:300|Julius+Sans+One|Merriweather+Sans:400|Overpass:400|Quicksand"