Описание тега angular-animations

Используйте этот тег, чтобы лучше ссылаться на анимацию в angular версии 2.0 и более поздних версиях или в BrowserAnimationsModule.
1 ответ

Как я могу применить одну и ту же анимацию для списка элементов HTML один за другим с угловой 4-анимацией?

Я пытаюсь применить угловую анимацию 4 к списку HTML-элементов, таких как facilities = ['<p> <span class="glyphicon glyphicon-hand-right"> </span> Text 1</p>', '<p> <span class="glyphicon glyphicon-hand-right">&lt…
20 авг '17 в 11:05
1 ответ

Angular 2: Как использовать угловую анимацию для постепенного появления / исчезновения компонентов внутри <router-outlet> после начальной загрузки?

На данный момент код работает как надо (но теперь, как я хочу, ха-ха). Анимация работает и исчезает, когда страница первоначально загружается и инициализируется в первый раз, но анимации не появляются, когда я обращаюсь к маршрутам внутри после того…
27 июл '18 в 18:24
1 ответ

CSS анимационный расширяющий компонент

У меня есть две секции карт рядом, используя флекс-бокс. В каждой ячейке есть переключатель "развернуть" (например, если развернуть вправо, он просто скрывает левую карточную секцию и наоборот). Я в основном хочу оживить расширяющуюся карту, но я не…
0 ответов

Angular 5 параметров анимации не работает

Я создал следующую анимацию в Angular 5 с параметрами: export const fadeAnimation = animation([ style({ opacity: '{{opacityFrom}}' }), animate('{{time}}'), style({ opacity: '{{opacityTo}}' }), ], { params: { opacityFrom: '0', time: '1s', opacityTo: …
26 мар '18 в 15:53
1 ответ

Угловая анимация оставляет переход на дочернем div

Enter анимация работает нормально, но анимация выхода не работает. если я перемещу @modalFadeZoom к родительскому элементу, оба перехода будут работать, но проблема в том, что масштабирование не происходит из центра модальной зоны, что дает странную…
13 июл '17 в 15:49
3 ответа

Angular (4, 5, 6, 7) - простой пример слайд-анимации на ngIf

Каков минимум и родной способ Angular4 вставлять и выдвигать элемент контейнера? например &lt;div ngIf="show"&gt; &lt;!-- Content --&gt; &lt;/div&gt; Вставьте содержимое (сверху вниз, точно так же, как jQuery. SlideDown ()), когда показ превратится …
12 ноя '17 в 12:41
1 ответ

Анимация одного элемента внутри петли Angular 4

Я новичок в Angular 4, и я пытаюсь применить анимацию к одному элементу после того, как щелкнем по нему. в моей текущей конфигурации, когда я нажимаю, все элементы внутри цикла запускают эту анимацию &lt;div *ngFor="let media of mediaContent ; let i…
28 мар '18 в 15:45
1 ответ

Анимировать угловую страницу

У меня есть дом и зарегистрировать компонент. В домашнем компоненте есть нумерация страниц, плавающая сверху вниз с правой стороны и кнопка регистрации справа. Цвет его фона - желтый. При нажатии на кнопку регистрации, домашний компонент должен пере…
13 фев '19 в 04:51
1 ответ

Как выполнить автоматическую прокрутку списка в Angular6?

Привет я пытался реализовать автоматическую прокрутку на странице инициализации, но я не получил решение есть ли в метод сборки в Angular? я пытался import { Component } from '@angular/core'; import { trigger, state, style, animate, transition, keyf…
28 фев '19 в 12:18
1 ответ

Возможен ли компонент Angular 2/4 для анимации хоста с помощью привязок хоста?

Я пытаюсь вывести компонент из самого компонента. Я не знаю, возможно ли это, я пытаюсь добиться этого с помощью HostBinding, Анимации: animations: [ trigger('fade', [ state('fadeIn', style({ opacity: 1 })), state('fadeOut', style({ opacity: 0, visi…
21 июл '17 в 12:08
1 ответ

Angular 2 - Как реализовать Router Animation для определенного div?

У меня есть список divЯ хочу, чтобы скользить определенный элемент по клику. В настоящее время все элементы являются скользящими, так как состояние является единственной переменной для всех элементов. .html &lt;div *ngFor="let item of [1,2,3,4,5]" […
1 ответ

Угловая анимация не работает

Я пытаюсь запустить ввод анимации для появления элементов на моей странице, которые зациклены через *ngFor. Я попытался использовать обратный вызов, чтобы выяснить, были ли эти анимации когда-либо запущены, и они были! Но ничего не было показано. В …
02 апр '18 в 19:42
0 ответов

Использование переменных в угловой анимации

Я хочу сделать анимацию, чтобы использовать переменную из компонента, а не жестко кодировать шестнадцатеричный цвет. Как мне это сделать? Я должен упомянуть, что мне это действительно нужно, потому что в будущем я хочу создавать случайные цвета, поэ…
02 май '18 в 12:44
1 ответ

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

У меня есть простой триггер анимации, который затухает элемент в и из. trigger('fadeInOut', [ transition(':enter', [ style({ opacity: 0 }), animate('0.1s ease-in-out') ]), transition(':leave', [animate('0.1s ease-in-out', style({ opacity: 0 }))]) ])…
12 май '18 в 17:31
1 ответ

Angular - Как определить параметры анимации по умолчанию?

Я работаю с угловой анимацией, и для улучшения моей анимации мне нужно использовать параметры. Для этого я сделал так, как предложил этот ответ, с интерполяцией. Вот что я имею для государства: state('position', style({ transform: 'translateX({{tran…
22 дек '17 в 18:46
2 ответа

Как использовать входные параметры в угловой анимации 6?

В этой анимации я пытаюсь уменьшить ширину от 100% до динамической начальной ширины "toolWidth" (в процентах). Переменная "toolWidth" может быть установлена ​​пользователем в приложении. Анимация: trigger('testAnimation', [ state('opened', style({ '…
11 июн '18 в 21:21
1 ответ

Angular Animation: отступ не анимируется с высотой 0->*

Я написал анимацию ящика с Angular. Выглядит так: transition(':enter', [ style({height: '0', opacity: 0}), group([ animate(300, style({height: '*'})), animate('300ms ease-in-out', style({'opacity': '1'})) ]) ]) , transition(':leave', [ style({height…
06 авг '18 в 08:49
1 ответ

Условно: введите анимацию компонента в угловых

Учитывая маршруты моего приложения: const appRoutes: Routes = [ { path: '', component: HomeComponent, children: [ {path: 'datascreen', component: DataComponent}, {path: '', component: IntroComponent} ] } ]; У меня есть домашний экран, который должен…
19 дек '17 в 14:08
1 ответ

Раскрывающийся список Angular 4 не работает с использованием анимации

HTML &lt;div class="wrapper"&gt; &lt;nav id="sidebar"&gt; &lt;div class="sidebar-header"&gt; &lt;h3&gt;BackOffice&lt;/h3&gt; &lt;strong&gt;BO&lt;/strong&gt; &lt;/div&gt; &lt;ul class="list-unstyled components"&gt; &lt;!-- &lt;li class="active" --&gt…
06 фев '18 в 12:32
2 ответа

Angular 5 Просмотр анимаций, но условный

У меня есть пронумерованное навигационное меню с 6 пунктами, и их порядок важен, например, например, оформить заказ, войти в систему / создать учетную запись, затем отгрузить, а затем настроить платеж: Вы можете вернуться к шагу на любом этапе. Форв…