Угловая анимация срабатывает только при следующем движении мыши - PullRequest
Новая
       8

Угловая анимация срабатывает только при следующем движении мыши

0 голосов
/ 26 июня 2019

Я пытаюсь реализовать анимацию при обновлении моего списка. Это код анимации, который я использую в своем компоненте: 

animations: [
    trigger('listAnimation', [
      transition('* => *', [
        query(':enter', style({ opacity: 0, transform: 'translateX(-15px)' })),
        query(':enter', stagger('0ms', [
          animate('300ms ease-out', style({ opacity: 1, transform: 'translateX(0)' }))
        ]))
      ])
    ])
  ]

На мой взгляд, у меня есть: 

 <div #ts class="ts ts-container ts-bot-wrapper" style="overflow: visible;" [@listAnimation]="bot.length">

          <ng-template ngFor let-i="index" let-item [ngForOf]="bot">

            <div class="ts-messages-container">
              <div *ngIf="!item.typing && item.message" class="ts-message">
                <div class="ts-message-content text"
                  [ngClass]="{'ts-from-bot': item.from === 'bot', 'ts-from-me': item.from === 'me'}">
                  <span [innerHTML]="(item.innerHTML || item.message) | safe: 'html'">{{ item.message }}</span>
                  <img *ngIf="item.image && item.image !== ''" class="ts-message-content-image" [src]="item.image"
                    alt="BOT">
                </div>
              </div>

              <div *ngIf="item.typing" class="ts-message">
                <div class="ts-message-content ts-loading">
                  <i class="ts-dot"></i>
                  <i class="ts-dot"></i>
                  <i class="ts-dot"></i>
                </div>
              </div>
            </div>

...

 </ng-template>

        </div>

Не знаю почему, но анимация срабатывает только тогда, когда я перемещаю мышь к другому элементу на моей странице, например, Параметр меню, параметр бокового меню и т. д. Кстати, он работал в angular 6, но теперь я обновился до angular 7, и он больше не работает.

Это может быть связано с обнаружением изменений или, может быть, с чем-то еще?

Пожалуйста, помогите?

...