cargdev/angular
1
0
Fork 0
Code Issues 17 Pull Requests Actions Packages Projects Releases Wiki Activity

feat(animations): allow animation integration support into host params

Browse Source 
Closes #9044
Closes #9933
This commit is contained in:
Matias Niemelä
2016-07-08 17:11:12 -07:00
parent 5af1e891cd
commit 806a25413c
15 changed files with 172 additions and 99 deletions
Download Patch File Download Diff File Expand all files Collapse all files

27
modules/playground/src/animate/app/animate-app.ts
View File

@ -19,22 +19,23 @@ import {
} from '@angular/core';
@Component({
host: {
'[@backgroundAnimation]': "bgStatus"
},
selector: 'animate-app',
styleUrls: ['css/animate-app.css'],
template: `
<div [@backgroundAnimation]="bgStatus">
<button (click)="state='start'">Start State</button>
<button (click)="state='active'">Active State</button>
|
<button (click)="state='void'">Void State</button>
<button (click)="state='default'">Unhandled (default) State</button>
<button style="float:right" (click)="bgStatus='blur'">Blur Page</button>
<hr />
<div *ngFor="let item of items" class="box" [@boxAnimation]="state">
{{ item }}
<div *ngIf="true">
something inside
</div>
<button (click)="state='start'">Start State</button>
<button (click)="state='active'">Active State</button>
|
<button (click)="state='void'">Void State</button>
<button (click)="state='default'">Unhandled (default) State</button>
<button style="float:right" (click)="bgStatus='blur'">Blur Page (Host)</button>
<hr />
<div *ngFor="let item of items" class="box" [@boxAnimation]="state">
{{ item }}
<div *ngIf="true">
something inside
</div>
</div>
`,