Я пытаюсь получить html-файл bind, который имеет функции html и java script (JQuery), в мое угловое приложение.
Так я связываю html-файл с компонентом html.
<div [innerHTML]="currentDetailEntry?.content | sanitizeHtml"></div>
Я создал @pipe для выполнения этой задачи.
import { Pipe, PipeTransform, SecurityContext } from '@angular/core';
import { DomSanitizer, SafeHtml } from '@angular/platform-browser';
@Pipe({
name: 'sanitizeHtml'
})
export class SanitizeHtmlPipe implements PipeTransform {
constructor(private _sanitizer: DomSanitizer) { }
transform(v: string, type: string): safeHTML {
return this._sanitizer.bypassSecurityTrustHtml(v);
}
}
Итак, когда я нажимаю кнопку, на которой событие onClick не работает.
Ошибка: Uncaught ReferenceError: soundPlay не определен в HTMLAnchorElement.onclick
Так выглядит содержимое файла html:
<!DOCTYPE html PUBLIC "-//W3C//DTDXHTML 1.0 Transitional//EN" "https://www.w3.org/TR/html4/strict.dtd">
<table border="0" cellpadding="0" cellspacing="0" width="100%" style="height:100%; border-right: 14px solid #FEE0A0; border-left: 14px solid #FEE0A0; border-bottom: 14px solid #FEE0A0" xmlns:java="http://xml.apache.org/xalan/java">
<tr>
<td valign="top">
<table border="0" cellpadding="0" cellspacing="0" width="100%">
<tr>
<td class="Fascia" valign="top" align="left">Embeded Text</td>
<td class="Face" valign="top" align="right">PCL</td>
</tr>
<tr>
<td valign="top" height="100%">
<div class="Entry">
<table border="0" cellpadding="0" cellspacing="0" width="100%">
<tr>
<td valign="baseline">
<img src="se/images/flag_lang2_22_16.gif" alt="">
<span class="Hword"><span class="tt">aardwolf</span>
</span>
<span class="Phon">/ˈɑːdwʊlf</span>
<span class="Gramm">Am</span>
<span class="Phon">ˈɑːrdwʊlf/</span>
<script> //====================================================================== var soundEmbed = null; var Path = "snd/se/" var Ext = ".mp3" var Mime = "audio/mpeg" var noDisplay = "height:0;width:0" //====================================================================== function soundPlay(which) { which = Path + which + Ext // alert("Play sound " + which); if (!soundEmbed) { soundEmbed = document.createElement("embed"); soundEmbed.setAttribute("src", which); soundEmbed.setAttribute("style", noDisplay); soundEmbed.setAttribute("autostart", true); soundEmbed.setAttribute("type", Mime); } else { document.body.removeChild(soundEmbed); soundEmbed.removed = true; soundEmbed = null; soundEmbed = document.createElement("embed"); soundEmbed.setAttribute("src", which); soundEmbed.setAttribute("style", noDisplay); soundEmbed.setAttribute("autostart", true); soundEmbed.setAttribute("type", Mime); } soundEmbed.removed = false; document.body.appendChild(soundEmbed); } //====================================================================== </script>
<a onClick="soundPlay('00/00013'); return false" href="#" class="button">
<img src="se/images/sound_play_button.gif" name="img" onmouseover="document.img.src='se/images/sound_play_hover.gif'" onmouseout="document.img.src='se/images/sound_play_button.gif'" alt="" title=" Play " border=""></a>
</td>
</tr>
<tr>
<td valign="top">
<div class="Part">
<span class="Num2"></span>
<span class="HwGramm" title=" sostantivo ">n.</span>
<p class="trans">
<span class="Num"></span>
(<span class="Cat" title=" zoologia ">Zool</span>)
<span class="Trad"><span class="tt">protele</span></span>
<span class="Gramm">m.</span>
</p>
</div>
</td>
</tr>
</table>
</div>
</td>
</tr>
<tr>
<td height="53"></td>
</tr>
</table>
</td>
</tr>
<tr>
<td align="center" valign="bottom" class="copy">Copyright © </td>
</tr>
</table>