Question

我在Angular 7项目中集成了html模板，但无法正常工作

我将模板文件添加到assets / template / ..下，并将导入项添加到angular.json中，如：

“样式”：[“ src / assets / template / css / style-customizer.css”，...]，
“脚本”：[“ src / assets / template / js / vendor / modernizr-2.8.3.min.js”，...]

我编辑了html代码：

删除了文档类型和html标记
删除了所有标题
删除了所有的css和js导入
编辑图像源

（例如src =“ / assets / template / img / slider / 1.jpg” alt =“主滑块” title =“＃htmlcaption1”）

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

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

某些图片未显示
某些CSS无法正常工作
和某些动画不起作用

而且我的控制台没有任何错误

Answer 1

我通常不在angular.json中使用样式数组，相反，我将所有全局样式导入为.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"

Answer 2

只需在encapsulation: ViewEncapsulation.None中添加@component，如下所述。

@Component({
    selector: 'app-root',
    templateUrl: './app.component.html',
    styleUrls: ['./app.component.css'],
    encapsulation: ViewEncapsulation.None
})

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

2 个答案: