منسّق Angular
نسّق قوالب مكوّنات Angular باستخدام منسّق Angular هذا. ألصق HTML القالب الذي يتضمن التوجيهات البنيوية والروابط والاستيفاء، وستضع الأداة العناصر الكتلية مثل div وsection وp وul وtable في أسطر منفصلة مع مسافة بادئة مقدارها مسافتان، وتزيل المسافات البيضاء الزائدة، وتنسّق كتل script وstyle المضمنة. تبقى التوجيهات والروابط والتعبيرات كما كُتبت تمامًا، ليحصل مطوّرو Angular على قوالب مرتبة بسرعة.
الأسئلة الشائعة
ما الذي يمكنني تنسيقه باستخدام منسّق Angular؟
ينسّق قوالب مكوّنات Angular، أي HTML الذي تكتبه في ملفات .component.html أو ضمن سلسلة قالب. ولا يتعامل هنا مع فئات مكوّنات TypeScript؛ استخدم منسّق TypeScript لتنسيقها.
هل تُحفَظ التوجيهات والروابط؟
نعم، تُنسخ السمات مثل *ngIf و*ngFor و[value] و(click) و[(ngModel)]، وعمليات الاستيفاء مثل {{ user.name }}، كما كُتبت تمامًا. الذي يتغير فقط هو المسافات البيضاء بين العناصر.
ما العناصر التي تظهر في أسطر منفصلة؟
عندما يحتوي العنصر على عناصر فرعية كتلية مثل div أو section أو article أو header أو footer أو nav أو main أو form أو p أو h1 إلى h6 أو ul أو ol أو table، يظهر كل عنصر فرعي في سطر مستقل مع مسافة بادئة. أما العناصر التي لا تحتوي على عناصر فرعية كهذه فتبقى في سطر واحد، مع اختزال سلاسل المسافات البيضاء إلى مسافة واحدة.
لماذا يبقى المكوّن المخصص في سطر واحد؟
العناصر المخصصة مثل app-root أو mat-card ليست عناصر HTML كتلية، لذا يبقى محتواها في سطر واحد ما لم يتضمن عنصرًا كتليًا مثل div أو p. أَحِط المحتوى بعنصر كتلي إذا أردت عرضه على أسطر متعددة.
هل توضع عناصر القائمة في أسطر منفصلة؟
ليس بمفردها: فـ li ليس من الوسوم الكتلية، لذا تبقى ul التي لا تحتوي إلا على عناصر li في سطر واحد. أضف محتوى كتليًا مثل div داخل العناصر لتوزيعه على أسطر.
ماذا يحدث لوسوم script وstyle؟
تُنسّق كتل style المضمنة بصيغة CSS، والبرامج النصية المضمنة بصيغة JavaScript، مع مسافة بادئة أسفل الوسم الخاص بها. ويُحفَظ محتوى عنصري pre وtextarea كما كُتب تمامًا.
هل تُحفَظ تعليقات HTML؟
نعم، تُحفَظ تعليقات HTML وتوضع في سطر مستقل داخل العناصر الموسّعة. ويُنسخ محتواها كما هو تمامًا، لذلك تبقى العلامات التي جرى التعليق عليها كما كانت.
هل تتحقق الأداة من صحة القالب؟
لا، فهي لا تترجم القالب ولا تتحقق منه، كما تنسّق الوسوم غير المغلقة قدر الإمكان. استخدم ng build أو خدمة لغة Angular في محررك للعثور على أخطاء القالب.
لماذا أُحيطت المخرجات بسياج html؟
قوالب Angular هي HTML، لذا تُعاد النتيجة في كتلة كود Markdown مع وسم html. انسخ الأسطر الواقعة بين السياجين إلى ملف القالب.
ما الحجم الأقصى للقالب؟
يمكن معالجة ما يصل إلى 5 MB في كل تشغيل، وتُرفض المدخلات الأكبر مع عرض رسالة. وتتطابق المخرجات مع خيار Angular في منسّق الكود.