Я относительно любитель Angular и Ionic, и, пытаясь что-то создать, я столкнулся с проблемой.
У меня есть внешний URL-адрес, который я пытаюсь загрузить в iframe, и получаю такую проблему, как:
Итак, у меня есть две страницы: главная и статья.В home.page.html у меня есть ионная карта с событием щелчка, как показано ниже:
<ion-card class="newsCard" color="light" (click)="showArticleInModal(item.url)" *ngFor="let item of itemStack; let i = index">
//....
</ion-card-content>
В моем home.page.ts у меня есть функция как,
async showArticleInModal(url) {
const modal = await this.modalController.create({
component: ArticlePage,
animated: true,
mode: "md",
showBackdrop: true,
componentProps: { url: this.sanitizer.bypassSecurityTrustResourceUrl(url) }
});
return await modal.present();
}
Я передаю очищенный URL на модальную страницу под названием article в моем случае.В моем article.page.html у меня есть код ниже:
<ion-content>
<div #frame style="width:100vw; height:100vh; overflow:scroll !important;-webkit-overflow-scrolling:touch !important">
<!-- <iframe style="width:100vw; height:100vh;" [src]="url | cleanurl" class="iframe" scrolling="yes"></iframe> -->
<iframe [src]="url | cleanurl" style="width:100vw; height:100vh;" class="iframe" scrolling="yes"></iframe>
</div>
</ion-content>
Cleanurl - это пользовательский канал, который я загрузил с помощью shared.module.ts
import { NgModule } from "@angular/core";
import { CleanurlPipe } from './cleanurl.pipe';
@NgModule({
declarations: [CleanurlPipe],
exports: [CleanurlPipe]
})
export class SharedModule { }
Однако яполучая ошибку, подобную этой,
ОШИБКА Ошибка: Uncaught (в обещании): Ошибка: не может соответствовать ни один маршрут.Сегмент URL: «SafeValue% 20must% 20use% 20% 5Bproperty% 5D»
Я не могу понять это, и мне нужна помощь.Может кто-нибудь, пожалуйста, посмотрите на это и скажите мне, чего не хватает?
Кстати, я проверил это решение ниже, но не сработало,
Заранее спасибо :)