亚洲在线久爱草,狠狠天天香蕉网,天天搞日日干久草,伊人亚洲日本欧美

為了賬號安全,請及時綁定郵箱和手機立即綁定
已解決430363個問題,去搜搜看,總會有你想問的

如何將外部 JS 和 CSS 文件加載到 Angular 5 中(文件加載延遲)

如何將外部 JS 和 CSS 文件加載到 Angular 5 中(文件加載延遲)

瀟湘沐 2024-01-18 14:44:22
正如標題所示,我在嘗試將外部 js 和 css 文件導入Angular 5應用程序時遇到一些問題。這是我到目前為止嘗試過的代碼片段組件.ts:  ngOnInit() {    this.loadScript();        // tried with constructor as well  }  loadScript () {    const head = document.getElementsByTagName('head')[0];    const link = document.createElement('link');    const s = this.document.createElement('script');    s.type = 'text/javascript';    s.src = 'https://**/assets/js/patterns/name.min.js';    link.id = 'pattern';    link.rel = 'stylesheet';    link.type = 'text/css';    link.href = 'https://**/assets/js/patterns/name.min.css';    link.media = 'all';    head.appendChild(link);    const __this = this;    s.onload = function () { __this.afterScriptAdded(); };    this.elementRef.nativeElement.appendChild(s); }還嘗試通過添加此行從 scss 文件加載 @import url("https://**/assets/js/patterns/name.min.css");我可以在網絡選項卡中看到文件,但問題是此文件加載會出現延遲,因此我的函數在沒有這些知識的情況下呈現,后來加載時沒有任何用處。它僅適用于從一個組件導航到另一個組件時重新加載的情況。它會第一次凍結,重新加載后,頁面將與動態腳本一起正確顯示。遇到了一些與之相關的問題,但沒有任何效果從 Angular 組件動態加載外部 javascript 文件如何在 Angular 中動態加載外部腳本?有誰遇到過類似的情況..非常感謝任何幫助:)
查看完整描述

1 回答

?
拉丁的傳說

TA貢獻1789條經驗 獲得超8個贊

最初試圖避免setTimeout這種情況發生。


然而,除了在一段延遲后加載文件之外,似乎沒有任何作用,我們允許組件完全渲染,然后將我們的 js (+ css) 文件附加到本機元素。


...


ngOnInit() {

   setTimeout(() => {

        this.loadScript();

   }, 100);

}


...

雖然它可以工作,但仍然設置靜態超時值。如果您對此有更好的解決方案,請告訴我。


快樂編碼。:)


查看完整回答
反對 回復 2024-01-18
  • 1 回答
  • 0 關注
  • 184 瀏覽
慕課專欄
更多

添加回答

舉報

0/150
提交
取消
微信客服

購課補貼
聯系客服咨詢優惠詳情

幫助反饋 APP下載

慕課網APP
您的移動學習伙伴

公眾號

掃描二維碼
關注慕課網微信公眾號