الفرق بين المراجعتين لصفحة: «Liquid/iteration»

من موسوعة حسوب
لا ملخص تعديل
ط مراجعة
 
(مراجعة متوسطة واحدة بواسطة مستخدم واحد آخر غير معروضة)
سطر 1: سطر 1:
== الوسوم Tags ذات النوع التكراري Iteration ==
<noinclude>{{DISPLAYTITLE:وسوم التكرار Iteration في Liquid}}</noinclude>
تشغّل الوسوم التكرارية كتلًا من الشيفرة تكراريًا.
تنفِّذ الوسوم التكرارية Iteration tags كتلًا من الشيفرة تكراريًا.


=== for ===
== for ==
ينفّذ كتلة من الشيفرة تكراريًا. اطّلع على قائمة كاملة بالسمات المتاحة attributes داخل حلقة <code>for</code> من خلال [https://shopify.dev/api/liquid/objects/for-loops forloop (object)].
ينفّذ كتلة من الشيفرة تكراريًا. اطّلع على قائمة كاملة بالسمات attributes المتاحة داخل حلقة <code>for</code> من خلال [https://shopify.dev/api/liquid/objects/for-loops forloop (object)].<syntaxhighlight lang="liquid">
{| class="wikitable"
|+
!الدخل
|-
|<syntaxhighlight lang="liquid">
{% for product in collection.products %}
{% for product in collection.products %}
   {{ product.title }}
   {{ product.title }}
{% endfor %}
{% endfor %}
</syntaxhighlight>الخرج:<syntaxhighlight lang="liquid">
hat shirt pants
</syntaxhighlight>
</syntaxhighlight>
|}
=== else ===
{| class="wikitable"
يحدّد حالة احتياطية لحلقة <code>for</code> والتي ستُنفَّذ إذا كان طول الحلقة صفرًا.<syntaxhighlight lang="liquid">
!الخرج
|-
|<code>hat shirt pants</code>
|}
 
==== else ====
يحدّد حالة احتياطية لحلقة <code>for</code> والتي ستُشغَّل إذا كان طول الحلقة صفرًا.
{| class="wikitable"
!الدخل
|-
|<syntaxhighlight lang="liquid">
{% for product in collection.products %}
{% for product in collection.products %}
   {{ product.title }}
   {{ product.title }}
سطر 31: سطر 17:
   The collection is empty.
   The collection is empty.
{% endfor %}
{% endfor %}
</syntaxhighlight>الخرج:<syntaxhighlight lang="liquid">
The collection is empty.
</syntaxhighlight>
</syntaxhighlight>
|}
=== break ===
{| class="wikitable"
يسبّب توقف تكرار الحلقة عندما تواجه وسم <code>break</code>.<syntaxhighlight lang="liquid">
!الخرج
|-
|<code>The collection is empty.‎</code>
|}
 
==== break ====
يسبّب توقف تكرار الحلقة عندما تواجه وسم <code>break</code>.
{| class="wikitable"
!الدخل
|-
|<syntaxhighlight lang="liquid">
{% for i in (1..5) %}
{% for i in (1..5) %}
   {% if i == 4 %}
   {% if i == 4 %}
سطر 52: سطر 29:
   {% endif %}
   {% endif %}
{% endfor %}
{% endfor %}
</syntaxhighlight>الخرج:<syntaxhighlight lang="liquid">
1 2 3
</syntaxhighlight>
</syntaxhighlight>
|}
=== continue ===
{| class="wikitable"
يسبّب أن تتخطى الحلقة التكرار الحالي عندما تواجه وسم <code>continue</code>.<syntaxhighlight lang="liquid">
!الخرج
|-
|‎<code>1 2 3</code>
|}
 
==== continue ====
يسبّب أن تتخطى الحلقة التكرار الحالي عندما تواجه وسم <code>continue</code>.
{| class="wikitable"
!الدخل
|-
|<syntaxhighlight lang="liquid">
{% for i in (1..5) %}
{% for i in (1..5) %}
   {% if i == 4 %}
   {% if i == 4 %}
سطر 73: سطر 41:
   {% endif %}
   {% endif %}
{% endfor %}
{% endfor %}
</syntaxhighlight>الخرج:<syntaxhighlight lang="liquid">
1 2 3  5
</syntaxhighlight>
</syntaxhighlight>
|}
== عاملات حلقة for ==
{| class="wikitable"
!الخرج
|-
|‎<code>1 2 3    5</code>
|}
 
=== معاملات حلقة for ===


==== limit ====
=== limit ===
يحدّد الحلقة بعدد محدّد من التكرارات.
يقيد الحلقة بعدد محدّد من التكرارات.<syntaxhighlight lang="liquid">
{| class="wikitable"
!الدخل
|-
|<syntaxhighlight lang="liquid">
<!-- if array = [1,2,3,4,5,6] -->
<!-- if array = [1,2,3,4,5,6] -->
{% for item in array limit:2 %}
{% for item in array limit:2 %}
   {{ item }}
   {{ item }}
{% endfor %}
{% endfor %}
</syntaxhighlight>الخرج:<syntaxhighlight lang="liquid">
1 2
</syntaxhighlight>
</syntaxhighlight>
|}
=== offset ===
{| class="wikitable"
يبدأ الحلقة عند دليل محدَّد.<syntaxhighlight lang="liquid">
!الخرج
|-
|‎<code>1 2</code>
|}
 
==== offset ====
يبدأ الحلقة عند دليل محدَّد.
{| class="wikitable"
!الدخل
|-
|<syntaxhighlight lang="liquid">
<!-- if array = [1,2,3,4,5,6] -->
<!-- if array = [1,2,3,4,5,6] -->
{% for item in array offset:2 %}
{% for item in array offset:2 %}
   {{ item }}
   {{ item }}
{% endfor %}
{% endfor %}
</syntaxhighlight>
</syntaxhighlight>الخرج:<syntaxhighlight lang="liquid">
|}
3 4 5 6
{| class="wikitable"
</syntaxhighlight>مرّر الكلمة الخاصة <code>continue</code>، لبدء حلقة من حيث توقفت الحلقة الأخيرة باستخدام نفس المكرّر.<syntaxhighlight lang="liquid">
!الخرج
|-
|‎<code>3 4 5 6</code>
|}
مرّر الكلمة الخاصة <code>continue</code>، لبدء حلقة من حيث توقفت الحلقة الأخيرة باستخدام نفس المكرّر.
{| class="wikitable"
!الدخل
|-
|<syntaxhighlight lang="liquid">
<!-- if array = [1,2,3,4,5,6] -->
<!-- if array = [1,2,3,4,5,6] -->
{% for item in array limit: 3 %}
{% for item in array limit: 3 %}
سطر 130: سطر 71:
   {{ item }}
   {{ item }}
{% endfor %}
{% endfor %}
</syntaxhighlight>الخرج:<syntaxhighlight lang="liquid">
1 2 3
4 5 6
</syntaxhighlight>
</syntaxhighlight>
|}
=== range ===
{| class="wikitable"
يحدّد مجالًا من الأعداد لتكرارها. يمكن تحديد المجال من خلال كلِّ من الأعداد والمتغيرة العددية، ويمكن سحبها من المتغير.<syntaxhighlight lang="liquid">
!الخرج
|-
|‎<code>1 2 3</code>
 
‎<code>4 5 6</code>
|}
 
==== range ====
يحدّد مجالًا من الأعداد لتكرارها. يمكن تحديد المجال من خلال كلِّ من الأعداد الحرفية والمتغيرة، ويمكن سحبها من المتغير.
{| class="wikitable"
!الدخل
|-
|<syntaxhighlight lang="liquid">
{% for i in (3..5) %}
{% for i in (3..5) %}
   {{ i }}
   {{ i }}
سطر 155: سطر 86:
   {{ i }}
   {{ i }}
{% endfor %}
{% endfor %}
</syntaxhighlight>الخرج:<syntaxhighlight lang="liquid">
3 4 5
1 2 3 4
</syntaxhighlight>
</syntaxhighlight>
|}
=== reversed ===
{| class="wikitable"
يعكس ترتيب الحلقة. انتبه إلى أن هذا العامل يختلف عن المرشّح <code>reverse</code>.<syntaxhighlight lang="liquid">
!الخرج
|-
|‎<code>3 4 5</code>
 
‎<code>1 2 3 4</code>
|}
 
==== reversed ====
يعكس ترتيب الحلقة. انتبه إلى أن هذا العامل يختلف عن الموشّح <code>reverse</code>.
{| class="wikitable"
!الدخل
|-
|<syntaxhighlight lang="liquid">
<!-- if array = [1,2,3,4,5,6] -->
<!-- if array = [1,2,3,4,5,6] -->
{% for item in array reversed %}
{% for item in array reversed %}
   {{ item }}
   {{ item }}
{% endfor %}
{% endfor %}
</syntaxhighlight>الخرج:<syntaxhighlight lang="liquid">
6 5 4 3 2 1
</syntaxhighlight>
</syntaxhighlight>
|}
== cycle ==
{| class="wikitable"
يدور ضمن حلقات عبر مجموعة من السلاسل النصية ويطبع هذه السلاسل النصية بالترتيب الذي مُرِّرت به كوسطاء، إذ يُطبَع وسيط السلسلة النصية التالية في كل مرة يُستدعَى بها <code>cycle</code>.
!الخرج
|-
|‎<code>6 5 4 3 2 1</code>
|}


=== cycle ===
يجب استخدام <code>cycle</code> ضمن كتلة حلقة <code>for</code>.<syntaxhighlight lang="liquid">
عبارة عن حلقات عبر مجموعة من السلاسل النصية وطباعة هذه السلاسل النصية بالترتيب الذي جرى تمريرها به كوسطاء، إذ يُطبَع وسيط السلسلة النصية التالية في كل مرة يُستدعَى بها <code>cycle</code>.
 
يجب استخدام <code>cycle</code> ضمن كتلة حلقة for.
{| class="wikitable"
!الدخل
|-
|<syntaxhighlight lang="liquid">
{% cycle "one", "two", "three" %}
{% cycle "one", "two", "three" %}
{% cycle "one", "two", "three" %}
{% cycle "one", "two", "three" %}
{% cycle "one", "two", "three" %}
{% cycle "one", "two", "three" %}
{% cycle "one", "two", "three" %}
{% cycle "one", "two", "three" %}
</syntaxhighlight>
</syntaxhighlight>الخرج:<syntaxhighlight lang="liquid">
|}
one
{| class="wikitable"
two
!الخرج
three
|-
one
|<code>one</code>
</syntaxhighlight>تشمل استخدامات <code>cycle</code> ما يلي:


<code>two</code>
* تطبيق أصناف classes فردية أو زوجية على صفوف في جدول.
* تطبيق صنف فريد على صور المنتج المُصغَّرة الأخيرة في صف.


<code>three</code>
== عاملات cycle ==
 
يقبل <code>cycle</code> عامل "مجموعة cycle" في الحالات التي تحتاج فيها إلى كتل <code>cycle</code> متعددة في قالب واحد. إذا لم يتوفر أي اسم لمجموعة cycle، فيُفترَض أن تمثّل الاستدعاءات المتعددة التي لها العاملات نفسها مجموعةً واحدة.<syntaxhighlight lang="liquid">
<code>one</code>
|}
تشمل استخدامات <code>cycle</code> ما يلي:
 
* تطبيق أصناف فردية أو زوجية على صفوف في جدول.
* تطبيق صنف فريد على product thumbnail الأخيرة للمنتج في صف.
 
=== معاملات cycle ===
تقبل <code>cycle</code> معامل "مجموعة الدورات" في الحالات التي تحتاج فيها إلى كتل <code>cycle</code> متعددة في قالب واحد. إذا لم يتوفر أي اسم لمجموعة الدورات، فيُفترَض أن تكون الاستدعاءات المتعددة التي لها المعاملات نفسها مجموعة واحدة.
{| class="wikitable"
!الدخل
|-
|<syntaxhighlight lang="liquid">
{% cycle "first": "one", "two", "three" %}
{% cycle "first": "one", "two", "three" %}
{% cycle "second": "one", "two", "three" %}
{% cycle "second": "one", "two", "three" %}
{% cycle "second": "one", "two", "three" %}
{% cycle "second": "one", "two", "three" %}
{% cycle "first": "one", "two", "three" %}
{% cycle "first": "one", "two", "three" %}
</syntaxhighlight>الخرج:<syntaxhighlight lang="liquid">
one
one
two
two
</syntaxhighlight>
</syntaxhighlight>
|}
== tablerow ==
{| class="wikitable"
يولّد هذا الوسم جدول HTML، إذ يجب أن يُغلَّف بوسم فتح <code><nowiki><table></nowiki></code> ووسم إغلاق <code><‎/table></code> خاصين بلغة HTML. اطّلع على قائمة كاملة بالسمات attributes المتاحة داخل حلقة <code>tablerow</code> من خلال  [https://shopify.dev/api/liquid/objects/tablerow tablerow (object)].<syntaxhighlight lang="liquid">
!الخرج
|-
|<code>one</code>
 
<code>one</code>
 
<code>two</code>
 
<code>two</code>
|}
 
=== tablerow ===
يولّد جدول HTML، إذ يجب أن يُغلَّف بوسم فتح <code><nowiki><table></nowiki></code> ووسم إغلاق <code><‎/table></code> خاصين بلغة HTML. اطّلع على قائمة كاملة بالسمات attributes المتاحة داخل حلقة <code>tablerow</code> من خلال  [https://shopify.dev/api/liquid/objects/tablerow tablerow (object)].
{| class="wikitable"
!الدخل
|-
|<syntaxhighlight lang="liquid">
<table>
<table>
{% tablerow product in collection.products %}
{% tablerow product in collection.products %}
سطر 248: سطر 136:
{% endtablerow %}
{% endtablerow %}
</table>
</table>
</syntaxhighlight>
</syntaxhighlight>الخرج:<syntaxhighlight lang="liquid">
|}
{| class="wikitable"
!الخرج
|-
|<syntaxhighlight lang="html">
<table>
<table>
   <tr class="row1">
   <tr class="row1">
سطر 277: سطر 160:
</table>
</table>
</syntaxhighlight>
</syntaxhighlight>
|}
== عاملات حلقة tablerow ==


=== معاملات حلقة tablerow ===
=== cols ===
 
يحدّد عدد الأعمدة التي يجب أن تحتوي عليها الجداول.<syntaxhighlight lang="liquid">
==== cols ====
يحدّد عدد الأعمدة التي يجب أن تحتوي عليها الجداول.
{| class="wikitable"
!الدخل
|-
|<syntaxhighlight lang="liquid">
{% tablerow product in collection.products cols:2 %}
{% tablerow product in collection.products cols:2 %}
   {{ product.title }}
   {{ product.title }}
{% endtablerow %}
{% endtablerow %}
</syntaxhighlight>
</syntaxhighlight>الخرج:<syntaxhighlight lang="liquid">
|}
{| class="wikitable"
!الخرج
|-
|<syntaxhighlight lang="html">
<table>
<table>
   <tr class="row1">
   <tr class="row1">
سطر 323: سطر 195:
</table>
</table>
</syntaxhighlight>
</syntaxhighlight>
|}
=== limit ===
 
يخرج من حلقة <code>tablerow</code> بعد فهرس معين.<syntaxhighlight lang="liquid">
==== limit ====
يخرج من حلقة <code>tablerow</code> بعد دليل معين.<syntaxhighlight lang="liquid">
{% tablerow product in collection.products cols:2 limit:3 %}
{% tablerow product in collection.products cols:2 limit:3 %}
   {{ product.title }}
   {{ product.title }}
سطر 332: سطر 202:
</syntaxhighlight>
</syntaxhighlight>


==== offset ====
=== offset ===
يبدأ حلقة <code>tablerow</code> بعد دليل معين.<syntaxhighlight lang="liquid">
يبدأ بحلقة <code>tablerow</code> بعد فهرس معين.<syntaxhighlight lang="liquid">
{% tablerow product in collection.products cols:2 offset:3 %}
{% tablerow product in collection.products cols:2 offset:3 %}
   {{ product.title }}
   {{ product.title }}
سطر 339: سطر 209:
</syntaxhighlight>
</syntaxhighlight>


==== range ====
=== range ===
يحدّد مجالًا من الأعداد لتكرارها. يمكن تحديد المجال من خلال كلِّ من الأعداد الحرفية والمتغيرة.<syntaxhighlight lang="liquid">
يحدّد مجالًا من الأعداد لتكرارها، ويمكن تحديد المجال من خلال كلِّ من الأعداد والمتغيرات العددية.<syntaxhighlight lang="liquid">
<!--variable number example-->
<!--variable number example-->


سطر 362: سطر 232:


* [https://shopify.github.io/liquid/tags/iteration/ صفحة Iteration في توثيق Liquid الرسمي.]
* [https://shopify.github.io/liquid/tags/iteration/ صفحة Iteration في توثيق Liquid الرسمي.]
[[تصنيف:Liquid]]

المراجعة الحالية بتاريخ 12:06، 5 أغسطس 2021

تنفِّذ الوسوم التكرارية Iteration tags كتلًا من الشيفرة تكراريًا.

for

ينفّذ كتلة من الشيفرة تكراريًا. اطّلع على قائمة كاملة بالسمات attributes المتاحة داخل حلقة for من خلال forloop (object).

{% for product in collection.products %}
  {{ product.title }}
{% endfor %}

الخرج:

hat shirt pants

else

يحدّد حالة احتياطية لحلقة for والتي ستُنفَّذ إذا كان طول الحلقة صفرًا.

{% for product in collection.products %}
  {{ product.title }}
{% else %}
  The collection is empty.
{% endfor %}

الخرج:

The collection is empty.

break

يسبّب توقف تكرار الحلقة عندما تواجه وسم break.

{% for i in (1..5) %}
  {% if i == 4 %}
    {% break %}
  {% else %}
    {{ i }}
  {% endif %}
{% endfor %}

الخرج:

1 2 3

continue

يسبّب أن تتخطى الحلقة التكرار الحالي عندما تواجه وسم continue.

{% for i in (1..5) %}
  {% if i == 4 %}
    {% continue %}
  {% else %}
    {{ i }}
  {% endif %}
{% endfor %}

الخرج:

1 2 3   5

عاملات حلقة for

limit

يقيد الحلقة بعدد محدّد من التكرارات.

<!-- if array = [1,2,3,4,5,6] -->
{% for item in array limit:2 %}
  {{ item }}
{% endfor %}

الخرج:

1 2

offset

يبدأ الحلقة عند دليل محدَّد.

<!-- if array = [1,2,3,4,5,6] -->
{% for item in array offset:2 %}
  {{ item }}
{% endfor %}

الخرج:

3 4 5 6

مرّر الكلمة الخاصة continue، لبدء حلقة من حيث توقفت الحلقة الأخيرة باستخدام نفس المكرّر.

<!-- if array = [1,2,3,4,5,6] -->
{% for item in array limit: 3 %}
  {{ item }}
{% endfor %}
{% for item in array limit: 3 offset: continue %}
  {{ item }}
{% endfor %}

الخرج:

1 2 3
4 5 6

range

يحدّد مجالًا من الأعداد لتكرارها. يمكن تحديد المجال من خلال كلِّ من الأعداد والمتغيرة العددية، ويمكن سحبها من المتغير.

{% for i in (3..5) %}
  {{ i }}
{% endfor %}

{% assign num = 4 %}
{% assign range = (1..num) %}
{% for i in range %}
  {{ i }}
{% endfor %}

الخرج:

3 4 5
1 2 3 4

reversed

يعكس ترتيب الحلقة. انتبه إلى أن هذا العامل يختلف عن المرشّح reverse.

<!-- if array = [1,2,3,4,5,6] -->
{% for item in array reversed %}
  {{ item }}
{% endfor %}

الخرج:

6 5 4 3 2 1

cycle

يدور ضمن حلقات عبر مجموعة من السلاسل النصية ويطبع هذه السلاسل النصية بالترتيب الذي مُرِّرت به كوسطاء، إذ يُطبَع وسيط السلسلة النصية التالية في كل مرة يُستدعَى بها cycle.

يجب استخدام cycle ضمن كتلة حلقة for.

{% cycle "one", "two", "three" %}
{% cycle "one", "two", "three" %}
{% cycle "one", "two", "three" %}
{% cycle "one", "two", "three" %}

الخرج:

one
two
three
one

تشمل استخدامات cycle ما يلي:

  • تطبيق أصناف classes فردية أو زوجية على صفوف في جدول.
  • تطبيق صنف فريد على صور المنتج المُصغَّرة الأخيرة في صف.

عاملات cycle

يقبل cycle عامل "مجموعة cycle" في الحالات التي تحتاج فيها إلى كتل cycle متعددة في قالب واحد. إذا لم يتوفر أي اسم لمجموعة cycle، فيُفترَض أن تمثّل الاستدعاءات المتعددة التي لها العاملات نفسها مجموعةً واحدة.

{% cycle "first": "one", "two", "three" %}
{% cycle "second": "one", "two", "three" %}
{% cycle "second": "one", "two", "three" %}
{% cycle "first": "one", "two", "three" %}

الخرج:

one
one
two
two

tablerow

يولّد هذا الوسم جدول HTML، إذ يجب أن يُغلَّف بوسم فتح <table> ووسم إغلاق <‎/table> خاصين بلغة HTML. اطّلع على قائمة كاملة بالسمات attributes المتاحة داخل حلقة tablerow من خلال tablerow (object).

<table>
{% tablerow product in collection.products %}
  {{ product.title }}
{% endtablerow %}
</table>

الخرج:

<table>
  <tr class="row1">
    <td class="col1">
      Cool Shirt
    </td>
    <td class="col2">
      Alien Poster
    </td>
    <td class="col3">
      Batman Poster
    </td>
    <td class="col4">
      Bullseye Shirt
    </td>
    <td class="col5">
      Another Classic Vinyl
    </td>
    <td class="col6">
      Awesome Jeans
    </td>
  </tr>
</table>

عاملات حلقة tablerow

cols

يحدّد عدد الأعمدة التي يجب أن تحتوي عليها الجداول.

{% tablerow product in collection.products cols:2 %}
  {{ product.title }}
{% endtablerow %}

الخرج:

<table>
  <tr class="row1">
    <td class="col1">
      Cool Shirt
    </td>
    <td class="col2">
      Alien Poster
    </td>
  </tr>
  <tr class="row2">
    <td class="col1">
      Batman Poster
    </td>
    <td class="col2">
      Bullseye Shirt
    </td>
  </tr>
  <tr class="row3">
    <td class="col1">
      Another Classic Vinyl
    </td>
    <td class="col2">
      Awesome Jeans
    </td>
  </tr>
</table>

limit

يخرج من حلقة tablerow بعد فهرس معين.

{% tablerow product in collection.products cols:2 limit:3 %}
  {{ product.title }}
{% endtablerow %}

offset

يبدأ بحلقة tablerow بعد فهرس معين.

{% tablerow product in collection.products cols:2 offset:3 %}
  {{ product.title }}
{% endtablerow %}

range

يحدّد مجالًا من الأعداد لتكرارها، ويمكن تحديد المجال من خلال كلِّ من الأعداد والمتغيرات العددية.

<!--variable number example-->

{% assign num = 4 %}
<table>
{% tablerow i in (1..num) %}
  {{ i }}
{% endtablerow %}
</table>

<!--literal number example-->

<table>
{% tablerow i in (3..5) %}
  {{ i }}
{% endtablerow %}
</table>

مصادر