正在尝试将值作为iframe url从本地数据库传递,并收到错误消息:在资源URL上下文中使用的不安全值。我正在尝试显示打印机IP的数组,这样我就可以通过网站检查它们的状态,无论如何,如果没有iframe,我会很高兴听到一些建议。
我是新的棱角和每一个帮助是更然后欢迎提前感谢。
import { Component, OnInit } from '@angular/core';
import { HttpClient } from '@angular/common/http';
import { DomSanitizer } from '@angular/platform-browser';
@Component({
selector: 'app-value',
templateUrl: './value.component.html',
styleUrls: ['./value.component.css']
})
export class ValueComponent implements OnInit {
values: any;
constructor(private http: HttpClient, private sanitizer: DomSanitizer) { }
ngOnInit() {
this.getValues();
}
getValues() {
this.http.get('http://localhost:5000/api/values/').subscribe(response => {
this.values = response;
}, error => {
console.log(error);
})
}
}
<H2>Print Manager</H2>
<div id="outerdiv">
<iframe src="http://192.168.1.6/general/status.html" id="inneriframe" scrolling="no" ></iframe>
</div>
<div *ngFor="let value of values">
<p>{{value.id}},{{value.hostName}},{{value.location}},{{value.manufacturer}},{{value.ip}}</p>
<span>Hostname: {{value.hostName}}</span>
<br>
<span>Location: {{value.location}}</span>
<br>
<span>Manufacturer: {{value.manufacturer}}</span>
<br>
<span>IP: {{value.ip}}</span>
</div>
3条答案
按热度按时间q8l4jmvw1#
使用管道更好。
创建Pipe:在app.component.ts*(首先加载的主组件)*
**声明管道:**创建管道后
**用法:**可将此选项与管道运算符和管道名称一起使用。示例:
使用此方法,您将获得一个净化的URL,而无需每次在其他组件中需要它时重写代码。
rlcwz9us2#
[src]=“杀毒软件.bypassSecurityTrustResourceUrl('http://'+值.ip +'/general/status.html')”帮我解决了
5n0oy7gb3#
您可以使用
@angular/platform-browser
中的AngularDomSanitizer
有关详细信息,请参阅Angular Guide
超文本: