• 1397/10/02

نحوه اضافه کردن فایل های جاوااسکریپت به آنگولار :

عرض سلام و وقت بخیر

یه سوال داشتم در خصوص اضافه کردن فایل های جاوا اسکریپت به پروژه آنگولار

چندین روش برای اینکار وجود داره مانند اضافه کردن آنها در فایل index.html و یا قرار دادن آن ها در بخش Script داخل فایل Angular.json

این روش ها کاملا کار میکنند ولی هنگامیکه بخواهیم داخل یک کامپوننت (در قسمت Html template کامپوننت )از این فایل ها استفاده نماییم برنامه کار نمیکند

هر دو روش ذکر شده را تست کرده ام ولی فقط در اولین کامپوننتی که Load می شود این فایل ها کار میکنند و پس از آن با تغییر Route دیگر برنامه کار نمی کند

به عنوان توضیحات بیشتر باید عرض کنم که بنده از یک Admin panel آماده می خواهم استفاده کنم (به نام OneUI) که تمامی مراحل تبدیل Html  را انجام داده ام و فقط این مورد باقی مانده است (فایل های Css به طور کامل و بدون مشکل در سراسر برنامه کار میکند و فقط فایل های JS کار نمیکنند)

خیلی ممنون میشم راهنمایی بفرمایید

 

  • 1397/10/03
  • ساعت 08:22

سلام 

معمولا js ها رو در layout اصلی قرار میدهید 

بعنوان مثال در home 

اینطوری در بار اول لود میشه و به همه المان ها دسترسی دارد 

 


  • 1397/10/03
  • ساعت 11:28

سلام

درست می فرمایید ولی در صورتیکه Js را در layout اصلی هم قرار دهیم همچنان این مشکل باقی است

با جستجوهای فراوان راه حل این مشکل رو پیدا کردم و خدمت دوستان عزیز میگم

مشکل اینه که هنگام load یک کامپوننت فقط بخشی از DOM به روز رسانی میشه که اسکریپت های جاوا اسکریپت از این به روز رسانی مطلع نمی شوند

لذا باید مجددا اونا رو لود کنیم

برای اینکار باید دستورات زیر در را constructor کامپوننت مورد نظر بنویسیم

()  constructor{

    const test = document.getElementById('test');
    if (test) {
      test.remove();
    }
    const testScript = document.createElement('script');
    testScript.setAttribute('id', 'test');
    testScript.setAttribute('src', 'assets/js/test.js');
    document.body.appendChild(testScript);
  }

با استفاده از قطعه کد بالا در هنگام load کامپوننت. فایل جاوااسکریپت مجددا بارگذاری میشود

 


logo-enamadlogo-samandehi