make the example lintable

This commit is contained in:
Foxandxss 2016-06-14 17:39:53 +02:00 committed by Naomi Black
parent c0edf369f4
commit 34447904b9
15 changed files with 63 additions and 60 deletions

View File

@ -670,7 +670,10 @@ gulp.task('lint', function() {
'!./public/docs/_examples/**/node_modules/**/*', '!./public/docs/_examples/**/node_modules/**/*',
'!./public/docs/_examples/_protractor/**/*', '!./public/docs/_examples/_protractor/**/*',
'!./public/docs/_examples/**/typings/**/*', '!./public/docs/_examples/**/typings/**/*',
'!./public/docs/_examples/**/typings-ng1/**/*' '!./public/docs/_examples/**/typings-ng1/**/*',
// temporary until codelyzer is fixed mgechev/codelyzer#60
'!./public/docs/_examples/animations/ts/app/hero.service.ts'
]) ])
.pipe(tslint({ .pipe(tslint({
rulesDirectory: ['node_modules/codelyzer'], rulesDirectory: ['node_modules/codelyzer'],

View File

@ -5,10 +5,9 @@ import {
state, state,
style, style,
animate, animate,
transition, transition
group
} from '@angular/core'; } from '@angular/core';
import { Hero, Heroes } from './hero.service'; import { Heroes } from './hero.service';
@Component({ @Component({
moduleId: module.id, moduleId: module.id,

View File

@ -11,7 +11,7 @@ import {
animate animate
} from '@angular/core'; } from '@angular/core';
// #enddocregion imports // #enddocregion imports
import { Hero, Heroes } from './hero.service'; import { Heroes } from './hero.service';
@Component({ @Component({
moduleId: module.id, moduleId: module.id,

View File

@ -5,10 +5,9 @@ import {
state, state,
style, style,
animate, animate,
transition, transition
group
} from '@angular/core'; } from '@angular/core';
import { Hero, Heroes } from './hero.service'; import { Heroes } from './hero.service';
@Component({ @Component({
moduleId: module.id, moduleId: module.id,

View File

@ -10,7 +10,7 @@ import {
animate animate
} from '@angular/core'; } from '@angular/core';
// #enddocregion imports // #enddocregion imports
import { Hero, Heroes } from './hero.service'; import { Heroes } from './hero.service';
@Component({ @Component({
moduleId: module.id, moduleId: module.id,

View File

@ -5,10 +5,9 @@ import {
state, state,
style, style,
animate, animate,
transition, transition
group
} from '@angular/core'; } from '@angular/core';
import { Hero, Heroes } from './hero.service'; import { Heroes } from './hero.service';
@Component({ @Component({
moduleId: module.id, moduleId: module.id,

View File

@ -5,10 +5,9 @@ import {
state, state,
style, style,
animate, animate,
transition, transition
group
} from '@angular/core'; } from '@angular/core';
import { Hero, Heroes } from './hero.service'; import { Heroes } from './hero.service';
@Component({ @Component({
moduleId: module.id, moduleId: module.id,

View File

@ -8,7 +8,7 @@ import {
transition, transition,
group group
} from '@angular/core'; } from '@angular/core';
import { Hero, Heroes } from './hero.service'; import { Heroes } from './hero.service';
@Component({ @Component({
moduleId: module.id, moduleId: module.id,

View File

@ -4,13 +4,12 @@ import {
Component, Component,
Input, Input,
trigger, trigger,
state,
style, style,
transition, transition,
animate animate
} from '@angular/core'; } from '@angular/core';
// #enddocregion imports // #enddocregion imports
import { Hero, Heroes } from './hero.service'; import { Heroes } from './hero.service';
@Component({ @Component({
moduleId: module.id, moduleId: module.id,

View File

@ -1,3 +1,4 @@
/* tslint:disable */
import { import {
Component, Component,
Input, Input,
@ -9,7 +10,7 @@ import {
transition, transition,
group group
} from '@angular/core'; } from '@angular/core';
import { Hero, Heroes } from './hero.service'; import { Heroes } from './hero.service';
@Component({ @Component({
moduleId: module.id, moduleId: module.id,

View File

@ -6,10 +6,9 @@ import {
style, style,
animate, animate,
transition, transition,
group,
keyframes keyframes
} from '@angular/core'; } from '@angular/core';
import { Hero, Heroes } from './hero.service'; import { Heroes } from './hero.service';
@Component({ @Component({
moduleId: module.id, moduleId: module.id,

View File

@ -5,10 +5,9 @@ import {
state, state,
style, style,
animate, animate,
transition, transition
group
} from '@angular/core'; } from '@angular/core';
import { Hero, Heroes } from './hero.service'; import { Heroes } from './hero.service';
@Component({ @Component({
moduleId: module.id, moduleId: module.id,

View File

@ -10,7 +10,7 @@ import {
animate animate
} from '@angular/core'; } from '@angular/core';
// #enddocregion imports // #enddocregion imports
import { Hero, Heroes } from './hero.service'; import { Heroes } from './hero.service';
@Component({ @Component({
moduleId: module.id, moduleId: module.id,

View File

@ -1,5 +1,5 @@
import { Component } from '@angular/core'; import { Component } from '@angular/core';
import { Hero, Heroes } from './hero.service'; import { Heroes } from './hero.service';
import { HeroListBasicComponent } from './hero-list-basic.component'; import { HeroListBasicComponent } from './hero-list-basic.component';
import { HeroListInlineStylesComponent } from './hero-list-inline-styles.component'; import { HeroListInlineStylesComponent } from './hero-list-inline-styles.component';
import { HeroListEnterLeaveComponent } from './hero-list-enter-leave.component'; import { HeroListEnterLeaveComponent } from './hero-list-enter-leave.component';
@ -52,7 +52,10 @@ import { HeroListTimingsComponent } from './hero-list-timings.component';
<div class="columns"> <div class="columns">
<div class="column"> <div class="column">
<h4>Enter & Leave & States</h4> <h4>Enter & Leave & States</h4>
<p>Enter and leave animations combined with active/inactive state animations. Different enter and leave transitions depending on state.</p> <p>
Enter and leave animations combined with active/inactive state animations.
Different enter and leave transitions depending on state.
</p>
<hero-list-enter-leave-states [heroes]=heroes></hero-list-enter-leave-states> <hero-list-enter-leave-states [heroes]=heroes></hero-list-enter-leave-states>
</div> </div>
<div class="column"> <div class="column">
@ -82,7 +85,10 @@ import { HeroListTimingsComponent } from './hero-list-timings.component';
</div--> </div-->
<!--div class="column"> <!--div class="column">
<h4>CSS Keyframes</h4> <h4>CSS Keyframes</h4>
<p>Enter and leave animations with three keyframes in each, to give the transition some bounce. Pull in the actual keyframes from CSS keyframes in component stylesheet.</p> <p>
Enter and leave animations with three keyframes in each, to give the transition some bounce.
Pull in the actual keyframes from CSS keyframes in component stylesheet.
</p>
<hero-list-multistep [heroes]=heroes></hero-list-multistep> <hero-list-multistep [heroes]=heroes></hero-list-multistep>
<hero-list-keyframes [heroes]=heroes></hero-list-keyframes> <hero-list-keyframes [heroes]=heroes></hero-list-keyframes>
</div--> </div-->

View File

@ -1,6 +1,6 @@
import { Injectable } from '@angular/core'; import { Injectable } from '@angular/core';
export class Hero { class Hero {
constructor(public name: string, constructor(public name: string,
public state = 'inactive') { public state = 'inactive') {
} }
@ -10,6 +10,22 @@ export class Hero {
} }
} }
let ALL_HEROES = [
'Wolverine',
'Magneto',
'Emma Frost',
'Thing',
'Kitty Pryde',
'Nightcrawler',
'Juggernaut',
'Beast',
'Captain America',
'Spider-Man',
'Puck',
'Alex Wilder',
'Doctor Strange'
].map(name => new Hero(name));
@Injectable() @Injectable()
export class Heroes implements Iterable<Hero> { export class Heroes implements Iterable<Hero> {
@ -36,19 +52,3 @@ export class Heroes implements Iterable<Hero> {
} }
} }
var ALL_HEROES = [
'Wolverine',
'Magneto',
'Emma Frost',
'Thing',
'Kitty Pryde',
'Nightcrawler',
'Juggernaut',
'Beast',
'Captain America',
'Spider-Man',
'Puck',
'Alex Wilder',
'Doctor Strange'
].map(name => new Hero(name));