مشکل در استفاده از انیمیشن ها

** سلام وقتتون بخیر***
من تونستم انیمیشن ها در انگولار رو پیاده سازی کنم. اما به یک مشکلی برخوردم :

  • یک منوی کشویی دارم. میخوام وقتی روی هر کدوم از منو ها کلیک شد، زیرمنوی مربوط به خودش باز بشه.
  • به این معنی که ، با یک trigger بشه دو تا المان رو بصورت متفاوت به حرکت درآورد.
    من از این کدها استفاده کردم اما جواب نداد :

فایل animations.ts :

trigger('openClose', [
        state('open', style({
            'opacity': 1
        })),
        state('close', style({
            'opacity': 0,
            'margin' : 0,
            'padding' : 0,
            'height' : 0
        })),
        transition('open <=> close', animate('.5s ease-in-out'))
    ])

فایل menu.component.html :

<a class="top-nav-link" (click)="toggleShow(1)">
    <i class="la la-archive"></i>
    <span>نمونه کارها</span>
    <i [@rotateIcon]="animationState[1]" class="la la-angle-left"></i>
</a>
<ul [@openClose]="animationState[1]">
 محتوای زیر منوها
</ul>

فایل menu.component.ts :

animationState = {
   1 : 'close',
   2: 'close'
 };
toggleShow(number: number) {
        if (number = 1) {
          this.animationState[1] = this.animationState[1] === 'close' ? 'open' : 'close';
        }
        if (number = 2) {
            this.animationState[2] = this.animationState[2] === 'close' ? 'open' : 'close';
        }
}

اگر راه حلی برای حل مشکل دارید ممنون میشم راهنمایی کنید


ثبت پرسش جدید
حسام موسوی
تخصص : طراح و برنامه نویس
@hesammousavi 5 سال پیش مطرح شد
1

سلام کلا انیمیشن شما اجرا میشه ؟


مهدیه سادات نژادحسینی
تخصص : Ui Ux Designer | Web Developer...
@mahdienezhadhoseini 5 سال پیش مطرح شد
0

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


مهدیه سادات نژادحسینی
تخصص : Ui Ux Designer | Web Developer...
@mahdienezhadhoseini 5 سال پیش مطرح شد
0

کسی برای این مشکل من راه حلی نداره ؟


برای ارسال پاسخ لازم است وارد شده یا ثبت‌نام کنید

ورود یا ثبت‌نام