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

chore: rename modules/examples to modules/playground

Browse Source 
The directory contains code authored in a style that makes it transpilable to dart. As such, these are not idiomatic examples of Angular 2 usage.

The main purpose of this directory is to enable experimentation with Angular within the angular/angular repository.

Closes #4342

Closes #4639
This commit is contained in:
kutyel
2015-10-10 00:25:17 +02:00
committed by Flavio Corpa Ríos
parent c3ab20cc87
commit e4e74ae65c
248 changed files with 190 additions and 190 deletions
Download Patch File Download Diff File Expand all files Collapse all files

14
modules/playground/src/animate/animate-app.ts Normal file
View File

@ -0,0 +1,14 @@
import {Component, View, NgIf} from 'angular2/angular2';
@Component({selector: 'animate-app'})
@View({
directives: [NgIf],
template: `
<h1>The box is {{visible ? 'visible' : 'hidden'}}</h1>
<div class="ng-animate box" *ng-if="visible"></div>
<button (click)="visible = !visible">Animate</button>
`
})
export class AnimateApp {
visible: boolean = false;
}

25
modules/playground/src/animate/css/app.css Normal file
View File

@ -0,0 +1,25 @@
body {
padding: 20px;
}
.box {
width: 100px;
height: 100px;
background-color: red;
transition: all 0.35s ease-in-out;
}
.box.blue {
background-color: blue;
}
.box.ng-enter {
opacity: 0;
height: 0;
}
.box.ng-enter-active {
opacity: 1;
height: 100px;
}
.box.ng-leave-active {
opacity: 0;
height: 0;
}

10
modules/playground/src/animate/index.html Normal file
View File

@ -0,0 +1,10 @@
<!doctype html>
<html>
<title>Animation Example</title>
<link rel="stylesheet" type="text/css" href="./css/app.css" />
<base href="/playground/src/animate/">
<body>
<animate-app>Loading...</animate-app>
$SCRIPTS$
</body>
</html>

6
modules/playground/src/animate/index.ts Normal file
View File

@ -0,0 +1,6 @@
import {AnimateApp} from './animate-app';
import {bootstrap} from 'angular2/bootstrap';
export function main() {
bootstrap(AnimateApp);
}