我正在我的角度应用程序中实现iFrame。当我直接在html中提供src url时,该应用程序正常运行并加载了请求的UI。但是,当我从后端获取src url并将其作为变量authguard传递时,会将url重定向到登录页面。该如何解决?
DefectsManagementComponent.html:
<div class="container-fluid dtep-style dtep-min-height-569px-minus-56px">
<div class="row">
<div class="col-lg-12 col-md-12 col-sm-12 col-xs-12">
<div class="form-group"></div>
</div>
</div>
<div class="row">
<div class="col-lg-12 col-md-12 col-sm-12 col-xs-12">
<div class="form-group">
<iframe id="defects" class="col-lg-12 col-md-12 col-sm-12 col-xs-12" title="Defects Management" src="url">
</iframe>
</div>
</div>
</div>
</div>
DefectsManagementComponent.ts:
export class DefectsManagementComponent implements OnInit {
url: string;
constructor(private service: SolutionInstanceService) {
}
ngOnInit() {
this.service.fetchSolutionByName("DEFECT_MANAGEMENT").subscribe(data =>{
this.url = data["solutionURL"];
});
}
}
AppRoutingModule.ts:
const routes: Routes = [
{
path: "login",
component: LoginComponent
},
{
path: "home",
canActivate: [AuthGuardGuard],
component: HomeComponent
},
{
path: "defects",
component: DefectsManagementComponent
},
{
path: "",
redirectTo: "login",
pathMatch: "full"
},
{
path: "**",
redirectTo: "login",
pathMatch: "full"
}
];
@NgModule({
imports: [RouterModule.forRoot(routes)],
exports: [RouterModule]
})
export class AppRoutingModule
答案 0 :(得分:2)
您应该在src周围使用方括号将url的值绑定到它,否则,您将为src分配字符串“ url”。还可以在iframe上使用ngIf仅在填充网址时显示它。然后,您需要清理URL。在https://stackoverflow.com/a/38269951/10632970上查看更多内容。