admin管理员组

文章数量:1318580

this is my all of code: in x-if template i can not use ">" or "<" sign and in the x-data also can not have a function and a if to pare two values is there any solution for this?

      <body>
        <div
          class="container"
          x-data="{
            selectedMonth: 0,
            clicked: null,
            daysGone: 0,
            counter: 0,
            allCells: 0,
    
            goAhead(){
                this.counter = this.counter + 1;
                return this.counter; 
            },
    
            events: localStorage.getItem('events') ? JSON.parse(localStorage.getItem('events')) : [],
            days: ['شنبه','یکشنبه','دوشنبه','سشنبه','چهارشنبه','پنجشنبه','جمعه'],
            
            load(){
                const dt = new persianDate();
                
                const day = dt.toLocale('fa').format('DD');
                const month = dt.toLocale('fa').format('MM');
                const year = dt.toLocale('fa').format('YYYY');
    
                var dayName = dt.toLocale('fa').format('dddd');
    
                const firstDayOfMonth = numberToPersian(dt.toLocale('fa').startOf('month').day());
                const daysInMonth = dt.daysInMonth();
    
                dateString = {
                    dayName: dayName,
                    year: year,
                    month: month,
                    day: firstDayOfMonth
                }
                this.daysGone = this.days.indexOf(dateString.dayName);
                
                this.allCells = this.daysGone + daysInMonth;
    
                console.log(this.daysGone);
            },
        }"
        x-init="load"
        >
          <div class="head"></div>
    
          **<template x-for="cell in allCells">
            <template x-if="cell < 6">
                <div class="day">1</div>
            </template>
            <template x-if="cell >= 6">
                <div class="gone">2</div>
            </template>
          </template>**
    
          <div class="calendar" x-ref="calendar"></div>
        </div>
      </body>

i tried many ways and tried to transfer the values to x-data but it also didnt work, sorry im nood at alpine js :(

this is my all of code: in x-if template i can not use ">" or "<" sign and in the x-data also can not have a function and a if to pare two values is there any solution for this?

      <body>
        <div
          class="container"
          x-data="{
            selectedMonth: 0,
            clicked: null,
            daysGone: 0,
            counter: 0,
            allCells: 0,
    
            goAhead(){
                this.counter = this.counter + 1;
                return this.counter; 
            },
    
            events: localStorage.getItem('events') ? JSON.parse(localStorage.getItem('events')) : [],
            days: ['شنبه','یکشنبه','دوشنبه','سشنبه','چهارشنبه','پنجشنبه','جمعه'],
            
            load(){
                const dt = new persianDate();
                
                const day = dt.toLocale('fa').format('DD');
                const month = dt.toLocale('fa').format('MM');
                const year = dt.toLocale('fa').format('YYYY');
    
                var dayName = dt.toLocale('fa').format('dddd');
    
                const firstDayOfMonth = numberToPersian(dt.toLocale('fa').startOf('month').day());
                const daysInMonth = dt.daysInMonth();
    
                dateString = {
                    dayName: dayName,
                    year: year,
                    month: month,
                    day: firstDayOfMonth
                }
                this.daysGone = this.days.indexOf(dateString.dayName);
                
                this.allCells = this.daysGone + daysInMonth;
    
                console.log(this.daysGone);
            },
        }"
        x-init="load"
        >
          <div class="head"></div>
    
          **<template x-for="cell in allCells">
            <template x-if="cell < 6">
                <div class="day">1</div>
            </template>
            <template x-if="cell >= 6">
                <div class="gone">2</div>
            </template>
          </template>**
    
          <div class="calendar" x-ref="calendar"></div>
        </div>
      </body>

i tried many ways and tried to transfer the values to x-data but it also didnt work, sorry im nood at alpine js :(

  • javascript
  • conditional-statements
  • syntax-error
  • alpine.js
Share Improve this question edited Jul 25, 2022 at 4:22 valiano 18.7k7 gold badges71 silver badges83 bronze badges asked Jul 23, 2022 at 7:06 AmirAmir 411 gold badge1 silver badge3 bronze badges
Add a ment  | 

1 Answer 1

Reset to default 6

Template tags can contain only one root element, so you need to wrap the child elements with a <div> or something:

<template x-for="cell in allCells">
   <div>
      <template x-if="cell < 6">
         <div class="day">1</div>
      </template>
      <template x-if="cell >= 6">
         <div class="gone">2</div>
      </template>
   <div>
</template>**

本文标签：

版权声明：本文标题：javascript - i am using alpine js and i can not have complex condition in (if) like : x-if=&quot;a &gt; b&quot;, les 内容由网友自发贡献，该文观点仅代表作者本人， 转载请联系作者并注明出处：http://www.betaflare.com/web/1742045915a2417782.html， 本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容，一经查实，本站将立刻删除。