Question

我有一个Angular 6应用，我从HTTP调用中获得了一个博客条目，我设置了一个变量，该变量的内容是innerHTML的{{1}}的结果，从而形成了博客显示的内容。它还具有图像和iframe，并且它们确实具有样式，因为它们是在编辑器中定义的。我的问题是我必须覆盖iframe值的CSS无法应用，并且无法获得所需的结果。

我在我的component.scss中定义了以下内容：

span

当我检查屏幕上呈现的博客项目时，在应用的CSS列表中找不到CSS。我不确定这是否是因为我在检索内容后会执行此操作，还是因为它不会简单地显示。

非常感谢您的帮助。

更新：添加组件代码：

component.ts

iframe {
width: 100% !important;
}

...

@Component({
    animations: [enterScreenFromBottom],
    selector: 'app-blog-entry',
    templateUrl: 'blog-entry.component.html',
    styleUrls: ['blog-entry.component.scss']
})
export class BlogEntryComponent

组件HTML：

ngOnInit() {
        this.loading = true;
        this.route.params.subscribe(p => {
            const id = p['id'];
            this.blogService.getById(id)
                            .then(b => {
                                this.blogEntry = b;
                                this.content = this.sanitizer.bypassSecurityTrustHtml(this.blogEntry.content);
                                this.loading = false;
                            })
                            .catch(e => {
                                console.log('Error getting blog entry ' + id, e);
                                this.loading = false;
                            });
        });
    }

组件scss：

<div [@enterScreenFromBottom]="state">
    <p [innerHTML]="content"></p>
</div>

更改iframe和图片的innerHTML CSS样式

0 个答案: