build(aio): change examples to CLI (#19248)

PR Close #19248
This commit is contained in:
Jesus Rodriguez
2017-08-22 21:31:15 +02:00
committed by Igor Minar
parent 344a5ca545
commit 9bbf009dff
377 changed files with 2339 additions and 1748 deletions

View File

@ -2,11 +2,11 @@
import { Component } from '@angular/core';
@Component({
selector: 'my-app',
selector: 'app-root',
template: `
<div class="container">
<h1>Reactive Forms</h1>
<hero-detail></hero-detail>
<app-hero-detail></app-hero-detail>
</div>`
})
export class AppComponent { }

View File

@ -2,11 +2,11 @@
import { Component } from '@angular/core';
@Component({
selector: 'my-app',
selector: 'app-root',
template: `
<div class="container">
<h1>Reactive Forms</h1>
<hero-list></hero-list>
<app-hero-list></app-hero-list>
</div>`
})
export class AppComponent { }

View File

@ -9,12 +9,12 @@
<hr>
<div class="demo">
<hero-list *ngIf="demo===final"></hero-list>
<hero-detail-1 *ngIf="demo===1"></hero-detail-1>
<hero-detail-2 *ngIf="demo===2"></hero-detail-2>
<hero-detail-3 *ngIf="demo===3"></hero-detail-3>
<hero-detail-4 *ngIf="demo===4"></hero-detail-4>
<hero-detail-5 *ngIf="demo===5"></hero-detail-5>
<app-hero-list *ngIf="demo===final"></app-hero-list>
<app-hero-detail-1 *ngIf="demo===1"></app-hero-detail-1>
<app-hero-detail-2 *ngIf="demo===2"></app-hero-detail-2>
<app-hero-detail-3 *ngIf="demo===3"></app-hero-detail-3>
<app-hero-detail-4 *ngIf="demo===4"></app-hero-detail-4>
<app-hero-detail-5 *ngIf="demo===5"></app-hero-detail-5>
<div *ngIf="demo >= 6 && demo !== final" >
@ -30,9 +30,9 @@
<hr>
<h2>Hero Detail</h2>
<h3>Editing: {{selectedHero.name}}</h3>
<hero-detail-6 [hero]=selectedHero *ngIf="demo===6"></hero-detail-6>
<hero-detail-7 [hero]=selectedHero *ngIf="demo===7"></hero-detail-7>
<hero-detail-8 [hero]=selectedHero *ngIf="demo===8"></hero-detail-8>
<app-hero-detail-6 [hero]=selectedHero *ngIf="demo===6"></app-hero-detail-6>
<app-hero-detail-7 [hero]=selectedHero *ngIf="demo===7"></app-hero-detail-7>
<app-hero-detail-8 [hero]=selectedHero *ngIf="demo===8"></app-hero-detail-8>
</div>
</div>

View File

@ -6,7 +6,7 @@ import { Hero } from './data-model';
import { HeroService } from './hero.service';
@Component({
selector: 'my-app',
selector: 'app-root',
templateUrl: './demo.component.html'
})
export class DemoComponent {

View File

@ -5,7 +5,7 @@ import { FormControl } from '@angular/forms';
// #enddocregion
@Component({
selector: 'hero-detail-1',
selector: 'app-hero-detail-1',
templateUrl: './hero-detail-1.component.html'
})
// #docregion v1

View File

@ -5,7 +5,7 @@ import { FormControl, FormGroup } from '@angular/forms';
// #enddocregion imports
@Component({
selector: 'hero-detail-2',
selector: 'app-hero-detail-2',
templateUrl: './hero-detail-2.component.html'
})
// #docregion v2

View File

@ -5,7 +5,7 @@ import { FormBuilder, FormGroup, Validators } from '@angular/forms';
// #enddocregion imports
@Component({
selector: 'hero-detail-3',
selector: 'app-hero-detail-3',
templateUrl: './hero-detail-3.component.html'
})
// #docregion v3

View File

@ -5,7 +5,7 @@ import { FormBuilder, FormGroup } from '@angular/forms';
// #enddocregion imports
@Component({
selector: 'hero-detail-3',
selector: 'app-hero-detail-3',
templateUrl: './hero-detail-3.component.html'
})
// #docregion v3a

View File

@ -7,7 +7,7 @@ import { states } from './data-model';
// #enddocregion imports
@Component({
selector: 'hero-detail-4',
selector: 'app-hero-detail-4',
templateUrl: './hero-detail-4.component.html'
})
// #docregion v4

View File

@ -5,7 +5,7 @@ import { FormBuilder, FormGroup, Validators } from '@angular/forms';
import { states } from './data-model';
@Component({
selector: 'hero-detail-5',
selector: 'app-hero-detail-5',
templateUrl: './hero-detail-5.component.html'
})
// #docregion v5

View File

@ -11,7 +11,7 @@ import { Hero, states } from './data-model';
////////// 6 ////////////////////
@Component({
selector: 'hero-detail-6',
selector: 'app-hero-detail-6',
templateUrl: './hero-detail-5.component.html'
})
// #docregion v6

View File

@ -11,7 +11,7 @@ import { Address, Hero, states } from './data-model';
// #enddocregion imports
@Component({
selector: 'hero-detail-7',
selector: 'app-hero-detail-7',
templateUrl: './hero-detail-5.component.html'
})
// #docregion v7

View File

@ -7,7 +7,7 @@ import { Address, Hero, states } from './data-model';
// #enddocregion imports
@Component({
selector: 'hero-detail-8',
selector: 'app-hero-detail-8',
templateUrl: './hero-detail-8.component.html'
})
// #docregion v8

View File

@ -10,7 +10,7 @@ import { HeroService } from './hero.service';
// #docregion metadata
@Component({
selector: 'hero-detail',
selector: 'app-hero-detail',
templateUrl: './hero-detail.component.html'
})
// #enddocregion metadata

View File

@ -4,5 +4,5 @@
</nav>
<div *ngIf="selectedHero">
<hero-detail [hero]="selectedHero"></hero-detail>
<app-hero-detail [hero]="selectedHero"></app-hero-detail>
</div>

View File

@ -12,6 +12,6 @@
<h2>Hero Detail</h2>
<h3>Editing: {{selectedHero.name}}</h3>
<!-- #docregion hero-binding -->
<hero-detail [hero]="selectedHero"></hero-detail>
<app-hero-detail [hero]="selectedHero"></app-hero-detail>
<!-- #enddocregion hero-binding -->
</div>

View File

@ -7,7 +7,7 @@ import { Hero } from './data-model';
import { HeroService } from './hero.service';
@Component({
selector: 'hero-list',
selector: 'app-hero-list',
templateUrl: './hero-list.component.html'
})
export class HeroListComponent implements OnInit {

View File

@ -1,18 +1,16 @@
<!DOCTYPE html>
<!-- #docregion -->
<html>
<html lang="en">
<head>
<title>Hero Form</title>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="styles.css">
<!-- #docregion bootstrap -->
<link rel="stylesheet" href="https://unpkg.com/bootstrap@3.3.7/dist/css/bootstrap.min.css">
<!-- #enddocregion bootstrap -->
<!-- Polyfills for older browsers -->
<script src="node_modules/core-js/client/shim.min.js"></script>
<script src="node_modules/core-js/client/shim.min.js"></script>
<script src="node_modules/zone.js/dist/zone.js"></script>
<script src="node_modules/reflect-metadata/Reflect.js"></script>
@ -25,7 +23,7 @@
</head>
<body>
<my-app>Loading...</my-app>
<app-root></app-root>
</body>
</html>

View File

@ -1,31 +1,17 @@
<!DOCTYPE html>
<!-- #docregion -->
<html>
<html lang="en">
<head>
<title>Hero Form</title>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="styles.css">
<!-- #docregion bootstrap -->
<link rel="stylesheet" href="https://unpkg.com/bootstrap@3.3.7/dist/css/bootstrap.min.css">
<!-- #enddocregion bootstrap -->
<!-- Polyfills for older browsers -->
<script src="node_modules/core-js/client/shim.min.js"></script>
<script src="node_modules/zone.js/dist/zone.js"></script>
<script src="node_modules/reflect-metadata/Reflect.js"></script>
<script src="node_modules/systemjs/dist/system.src.js"></script>
<script src="systemjs.config.js"></script>
<script>
System.import('main.js').catch(function(err){ console.error(err); });
</script>
</head>
<body>
<my-app>Loading...</my-app>
<app-root></app-root>
</body>
</html>

View File

@ -1,5 +1,13 @@
// tslint:disable:no-unused-variable
import { enableProdMode } from '@angular/core';
import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
import { AppModule } from './app/app.module';
import { environment } from './environments/environment';
if (environment.production) {
enableProdMode();
}
platformBrowserDynamic().bootstrapModule(AppModule);

View File

@ -1,6 +1,13 @@
// tslint:disable:no-unused-variable
import { enableProdMode } from '@angular/core';
import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
import { AppModule } from './app/app.module'; // just the final version
import { DemoModule } from './app/demo.module'; // demo picker
platformBrowserDynamic().bootstrapModule(DemoModule); // (AppModule);
import { AppModule } from './app/app.module'; // just the final version
import { DemoModule } from './app/demo.module'; // demo picker
import { environment } from './environments/environment';
if (environment.production) {
enableProdMode();
}
platformBrowserDynamic().bootstrapModule(DemoModule);