תבניות עם כידון

1. סקירה כללית

במדריך זה נבדוק את ספריית Handlebars.java לניהול קל של תבניות.

2. תלות Maven

נתחיל בהוספת ה- כידון תלות:

 כידון com.github.jknack 4.1.2 

3. תבנית פשוטה

תבנית כידון יכולה להיות כל סוג של קובץ טקסט. זה מורכב מתגים כמו {{name}} ו- {{#each people}}.

לאחר מכן אנו ממלאים את התגים הללו על ידי העברת אובייקט הקשר, כמו a מַפָּה או אחר לְהִתְנַגֵד.

3.1. באמצעות זֶה

להעביר סינגל חוּט ערך לתבנית שלנו, אנו יכולים להשתמש בכל לְהִתְנַגֵד כהקשר. עלינו להשתמש גם ב- {{זה}} tag בתבנית שלנו.

ואז הכידון מכנה את toString שיטה על אובייקט ההקשר ומחליף את התג בתוצאה:

@Test הציבור בטל כאשר ThereIsNoTemplateFile_ThenCompilesInline () זורק IOException {כידון כידון = כידון חדש (); תבנית תבנית = handlebars.compileInline ("שלום {{זה}}!"); תבנית מחרוזת String = template.apply ("Baeldung"); assertThat (templateString) .isEqualTo ("היי באלדונג!"); }

בדוגמה שלעיל, ראשית אנו יוצרים מופע של כידון, נקודת הכניסה ל- API שלנו.

לאחר מכן, אנו נותנים למופע זה את התבנית שלנו. פה, אנחנו פשוט מעבירים את התבנית בשורה, אבל נראה עוד רגע כמה דרכים חזקות יותר.

לבסוף, אנו נותנים לתבנית המהודרת את ההקשר שלנו. {{זֶה}} רק בסופו של דבר יתקשר toString, ולכן אנו רואים "היי באלדונג!".

3.2. עוברים א מַפָּה כאובייקט הקשר

רק ראינו איך לשלוח חוּט בהקשר שלנו, עכשיו בואו ננסה a מַפָּה:

@ מבחן ציבורי בטל כאשר ParameterMapIsSupplied_thenDisplays () זורק IOException {כידון כידון = כידון חדש (); תבנית תבנית = handlebars.compileInline ("שלום {{name}}!"); מפה parameterMap = HashMap חדש (); parameterMap.put ("שם", "באלדונג"); תבנית מחרוזת String = template.apply (parameterMap); assertThat (templateString) .isEqualTo ("היי באלדונג!"); }

בדומה לדוגמא הקודמת, אנו מרכיבים את התבנית שלנו ואז מעבירים את אובייקט ההקשר, אך הפעם כ- מַפָּה.

שים לב שאנו משתמשים {{שֵׁם}} במקום {{זֶה}}. המשמעות היא שעל המפה שלנו להכיל את המפתח, שֵׁם.

3.3. העברת אובייקט מותאם אישית כאובייקט הקשר

אנו יכולים גם להעביר אובייקט מותאם אישית לתבנית שלנו:

אדם בכיתה ציבורית {פרטי שם מחרוזת; פרטי בוליאני עסוק; כתובת כתובת פרטית = כתובת חדשה (); חברים ברשימה פרטית = ArrayList חדש (); מעמד סטטי ציבורי כתובת {רחוב מחרוזת פרטי; }}

משתמש ב אדם בכיתה, נשיג אותה תוצאה כמו הדוגמה הקודמת:

@ מבחן ציבורי בטל כאשר ParameterObjectIsSupplied_ThenDisplays () זורק IOException {כידון כידון = כידון חדש (); תבנית תבנית = handlebars.compileInline ("שלום {{name}}!"); אדם אדם = אדם חדש (); person.setName ("באלדונג"); תבנית מחרוזת String = template.apply (אדם); assertThat (templateString) .isEqualTo ("היי באלדונג!"); }

{{שֵׁם}} בתבנית שלנו יקדח לתוך שלנו אדם התנגד וקבל את הערך של שֵׁם שדה.

4. מעמיסי תבניות

עד כה השתמשנו בתבניות המוגדרות בתוך הקוד. עם זאת, זו לא האפשרות היחידה. אנחנו יכולים גם לקרוא תבניות מקבצי טקסט.

Handlebars.java מספקת תמיכה מיוחדת לקריאת תבניות מההקשר של מסלול הכיתה, מערכת הקבצים או השרת. כברירת מחדל, כידון סורק את שביל הכיתה לטעינת התבנית הנתונה:

@Test הציבור בטל כאשרNoLoaderIsGiven_ThenSearchesClasspath () זורק IOException {כידון כידון = כידון חדש (); תבנית תבנית = handlebars.compile ("ברכה"); אדם אדם = getPerson ("באלדונג"); תבנית מחרוזת מחרוזת = template.apply (אדם); assertThat (templateString) .isEqualTo ("היי באלדונג!"); }

אז בגלל שהתקשרנו לְלַקֵט במקום compileInline, זה רמז לכידון לחפש / שלום. hbs על מסלול הכיתה.

עם זאת, אנו יכולים גם להגדיר מאפיינים אלה באמצעות ClassPathTemplateLoader:

@ מבחן ציבורי בטל כאשר ClasspathTemplateLoaderIsGiven_ThenSearchesClasspathWithPrefixSuffix () זורק את IOException {TemplateLoader loader = ClassPathTemplateLoader חדש ("/ כידון", ".html"); כידון כידון = כידון חדש (מעמיס); תבנית תבנית = handlebars.compile ("ברכה"); // ... כמו מקודם }

במקרה זה, אנו מספרים כידון לחפש את / handlebars/greeting.html על מסלול הכיתה.

לבסוף, אנו יכולים לשרשר מספר רב TemplateLoader מקרים:

@ מבחן ציבורי בטל כאשר MultiLoadersAreGiven_ThenSearchesSequentially () זורק IOException {TemplateLoader firstLoader = חדש ClassPathTemplateLoader ("/ כידון", ".html"); TemplateLoader secondLoader = חדש ClassPathTemplateLoader ("/ תבניות", ".html"); כידון כידון = כידון חדש (). עם (firstLoader, secondLoader); // ... כמו מקודם }

אז הנה, יש לנו שני מעמיסים, וזה אומר שכידון יחפש בשתי ספריות בְּרָכָה תבנית.

5. עוזרים מובנים

עוזרים מובנים מספקים לנו פונקציונליות נוספת בעת כתיבת התבניות שלנו.

5.1. עם עוֹזֵר

ה עם עוזר משנה את ההקשר הנוכחי:

{{# עם כתובת}} 

אני גר ב {{street}}

{{/עם}}

בתבנית המדגם שלנו, {{# עם כתובת}} תג מתחיל את הקטע ואת {{/עם}} תג מסיים את זה.

בעיקרו של דבר, אנו קודחים לאובייקט ההקשר הנוכחי - נניח עמ 'ארסון - והגדרה כתובת כהקשר המקומי עבור עם סָעִיף. לאחר מכן, כל הפניה לשדה בסעיף זה תוקדם על ידי אדם.כתובת.

אז ה {{רְחוֹב}} תג יחזיק את הערך של אדם.כתובת.רחוב:

@Test הציבור בטל כאשר UsedWith_ThenContextChanges () זורק IOException {כידון כידון = כידון חדש (templateLoader); תבנית תבנית = handlebars.compile ("עם"); אדם אדם = getPerson ("באלדונג"); person.getAddress (). setStreet ("עולם"); תבנית מחרוזת מחרוזת = template.apply (אדם); assertThat (templateString) .contains ("

אני חי בעולם

"); }

אנו מרכיבים את התבנית שלנו ומקצים א אדם מופע כאובייקט ההקשר. שימו לב שה- אדם בכיתה יש כתובת שדה. זה התחום שאנו מספקים ל עם עוֹזֵר.

למרות שהלכנו רמה אחת לאובייקט ההקשר שלנו, זה בסדר גמור להעמיק אם לאובייקט ההקשר יש כמה רמות מקוננות.

5.2. כל אחד עוֹזֵר

ה כל אחד עוזר חוזר על אוסף:

{{#each friends}} {{name}} הוא החבר שלי. {{/כל אחד}}

כתוצאה מהתחלה וסגירה של קטע האיטרציה עם {{# כל חברים}} ו {{/כל אחד}} תגים, כידון יעקוב מעל חברים שדה של אובייקט ההקשר.

@ מבחן ציבורי בטל כאשר UsedEach_ThenIterates () זורק IOException {כידון כידון = כידון חדש (templateLoader); תבנית תבנית = handlebars.compile ("כל אחד"); אדם אדם = getPerson ("באלדונג"); חבר חבר 1 = getPerson ("Java"); אדם חבר 2 = getPerson ("אביב"); person.getFriends (). להוסיף (חבר 1); person.getFriends (). הוסף (friend2); תבנית מחרוזת מחרוזת = template.apply (אדם); assertThat (templateString) .contains ("ג'אווה היא החבר שלי.", "האביב הוא החבר שלי."); }

בדוגמה אנו מקצים שניים אדם מקרים ל חברים שדה של אובייקט ההקשר. לכן, כידון חוזר על חלק ה- HTML פעמיים בפלט הסופי.

5.3. אם עוֹזֵר

לבסוף, ה אם עוזר מספק טיוח מותנה.

{{# אם עסוק}} 

{{name}} עסוק.

{{אַחֵר}}

{{name}} אינו עסוק.

{{/אם}}

בתבנית שלנו אנו מספקים הודעות שונות בהתאם ל- עסוק שדה.

@ מבחן ציבורי בטל כאשר UsedIf_ThenPutsCondition () זורק IOException {כידון כידון = כידון חדש (templateLoader); תבנית תבנית = handlebars.compile ("אם"); אדם אדם = getPerson ("באלדונג"); person.setBusy (נכון); תבנית מחרוזת String = template.apply (אדם); assertThat (templateString) .contains ("

בלדונג עסוקה.

"); }

לאחר הידור התבנית, אנו מגדירים את אובייקט ההקשר. מאז עסוק שדה הוא נָכוֹן, התפוקה הסופית הופכת להיות

בלדונג עסוקה.

.

6. עוזרי תבנית מותאמים אישית

אנו יכולים גם ליצור עוזרים מותאמים אישית משלנו.

6.1. עוֹזֵר

ה עוֹזֵר ממשק מאפשר לנו ליצור עוזר תבנית.

כצעד ראשון, עלינו לספק יישום של עוֹזֵר:

עוזר חדש () {@Override אובייקט ציבורי חל (הקשר של אדם, אפשרויות אפשרויות) זורק IOException {String busyString = context.isBusy ()? "עסוק": "זמין"; להחזיר context.getName () + "-" + busyString; }}

כפי שאנו רואים, עוֹזֵר לממשק יש רק שיטה אחת שמקבלת את הֶקשֵׁר ו אפשרויות חפצים. לענייננו נפיק את ה- שֵׁם ו עסוק שדות של אדם.

לאחר יצירת העוזר, עלינו לרשום את העוזר המותאם אישית שלנו בכידון:

@ מבחן ציבורי בטל כאשר HelperIsCreated_ThenCanRegister () זורק IOException {כידון כידון = כידון חדש (templateLoader); handlebars.registerHelper ("isBusy", עוזר חדש () {@Override אובייקט ציבורי חל (הקשר של אדם, אפשרויות אפשרויות) זורק IOException {String busyString = context.isBusy ()? "עסוק": "זמין"; להחזיר context.getName ( ) + "-" + מחרוזת עסוקה;}}); // פרטי יישום}

בדוגמה שלנו, אנו רושמים את העוזר שלנו בשם עסוק משתמש ב Handlebars.registerHelper () שיטה.

כשלב האחרון, עלינו להגדיר תג בתבנית שלנו בעזרת שם העוזר:

{{#isBusy this}} {{/ isBusy}}

שימו לב שלכל עוזר יש תגית התחלה וסיום.

6.2. שיטות עוזר

כאשר אנו משתמשים ב- עוֹזֵר ממשק, אנו יכולים ליצור רק עוזר אחד בלבד. לעומת זאת, מחלקת מקור עוזר מאפשרת לנו להגדיר מספר עוזרי תבנית.

יתר על כן, איננו צריכים ליישם ממשק ספציפי כלשהו. אנו פשוט כותבים את שיטות העוזר שלנו בכיתה ואז HandleBars מחלץ הגדרות עוזר באמצעות השתקפות:

מחלקה ציבורית HelperSource {public String isBusy (הקשר אישי) {String busyString = context.isBusy ()? "עסוק": "זמין"; להחזיר context.getName () + "-" + busyString; } // שיטות עוזרות אחרות}

מכיוון שמקור עוזר יכול להכיל מספר יישומי עוזר, הרישום שונה מרישום העוזר היחיד:

@ מבחן ציבורי בטל כאשר HelperSourceIsCreated_ThenCanRegister () זורק IOException {כידון כידון = כידון חדש (templateLoader); handlebars.registerHelpers (HelperSource חדש ()); // פרטי יישום}

אנו רושמים את העוזרים שלנו באמצעות ה- Handlebars.registerHelpers () שיטה. יתר על כך, השם של שיטת העוזר הופך לשם של תג העוזר.

7. שימוש חוזר בתבנית

ספריית הכידון מספקת מספר דרכים לשימוש חוזר בתבניות הקיימות שלנו.

7.1. הכללת תבנית

הכללת תבניות היא אחת הגישות לשימוש חוזר בתבניות. זה מעדיף את הרכב התבניות.

שלום {{name}}!

זה התוכן של ה- כּוֹתֶרֶת תבנית - כותרת.html.

על מנת להשתמש בו בתבנית אחרת, עלינו להתייחס ל- כּוֹתֶרֶת תבנית.

{{> כותרת}} 

זהו הדף {{name}}

יש לנו את ה עמוד תבנית - page.html - הכוללת את כּוֹתֶרֶת תבנית באמצעות {{> כותרת}}.

כאשר Handlebars.java מעבד את התבנית, הפלט הסופי יכיל גם את התוכן של כּוֹתֶרֶת:

@ מבחן פומבי בטל כאשרOtherTemplateIsReferenced_ThenCanReuse () זורק IOException {כידון כידון = כידון חדש (templateLoader); תבנית תבנית = handlebars.compile ("עמוד"); אדם אדם = אדם חדש (); person.setName ("באלדונג"); תבנית מחרוזת מחרוזת = template.apply (אדם); assertThat (templateString) .contains ("

היי באלדונג!

", "

זה הדף Baeldung

"); }

7.2. ירושה תבניתית

לחלופין להרכב, כידון מספק את ירושת התבנית.

אנו יכולים להשיג יחסי ירושה באמצעות {{#לַחסוֹם}} ו {{#חלקי}} תגיות:

  {{#block "intro"}} זו ההקדמה {{/ block}} הודעת {{#block "}} {{/ block}} 

על ידי כך, ה מסר בסיס לתבנית שני חסימות - הקדמה ו הוֹדָעָה.

כדי להחיל ירושה, עלינו לבטל את אלה חסימות בתבניות אחרות באמצעות {{#חלקי}}:

{{# partial "message"}} שלום לך! {{/ partial}} {{> messagebase}}

זה פשטות תבנית. שימו לב שאנחנו כוללים את ה- מסר בסיס תבנית וגם לעקוף את הוֹדָעָה לַחסוֹם.

8. סיכום

במדריך זה בדקנו את Handlebars.java כדי ליצור ולנהל תבניות.

התחלנו בשימוש בסיסי בתגים ואז בדקנו את האפשרויות השונות לטעינת תבניות הכידון.

בדקנו גם את העוזרים בתבניות המספקים פונקציונליות רבה. לבסוף, בדקנו את הדרכים השונות לשימוש חוזר בתבניות שלנו.

לבסוף, בדוק את קוד המקור עבור כל הדוגמאות ב- GitHub.


$config[zx-auto] not found$config[zx-overlay] not found