Skip to content
This repository was archived by the owner on Dec 4, 2017. It is now read-only.

Commit 149a496

Browse files
wardbellwardbell
committed
docs(quickstart): add new setup instructions
1 parent f4cab48 commit 149a496

15 files changed

+418
-378
lines changed

‎public/docs/_examples/setup/e2e-spec.ts

+17
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,17 @@
1+
'use strict'; // necessary for es6 output in node
2+
3+
import { browser, element, by } from 'protractor';
4+
5+
describe('QuickStart E2E Tests', function () {
6+
7+
let expectedMsg = 'Hello Angular!';
8+
9+
beforeEach(function () {
10+
browser.get('');
11+
});
12+
13+
it(`should display: ${expectedMsg}`, function () {
14+
expect(element(by.css('h1')).getText()).toEqual(expectedMsg);
15+
});
16+
17+
});

‎public/docs/_examples/setup/ts/app/app.component.spec.ts

+35
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,35 @@
1+
/* tslint:disable:no-unused-variable */
2+
import { AppComponent } from './app.component';
3+
4+
import { async, ComponentFixture, TestBed } from '@angular/core/testing';
5+
import { By } from '@angular/platform-browser';
6+
import { DebugElement } from '@angular/core';
7+
8+
//////// SPECS /////////////
9+
describe('AppComponent', function () {
10+
let de: DebugElement;
11+
let comp: AppComponent;
12+
let fixture: ComponentFixture<AppComponent>;
13+
14+
beforeEach(async(() => {
15+
TestBed.configureTestingModule({
16+
declarations: [ AppComponent ]
17+
})
18+
.compileComponents();
19+
}));
20+
21+
beforeEach(() => {
22+
fixture = TestBed.createComponent(AppComponent);
23+
comp = fixture.componentInstance;
24+
de = fixture.debugElement.query(By.css('h1'));
25+
});
26+
27+
it('should create component', () => expect(comp).toBeDefined() );
28+
29+
it('should have expected <h1> text', () => {
30+
fixture.detectChanges();
31+
const h1 = de.nativeElement;
32+
expect(h1.innerText).toMatch(/angular/i,
33+
'<h1> should say something about "Angular"');
34+
});
35+
});

‎public/docs/_examples/setup/ts/app/app.component.ts

+8
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,8 @@
1+
// #docregion
2+
import { Component } from '@angular/core';
3+
4+
@Component({
5+
selector: 'my-app',
6+
template: `<h1>Hello Angular!</h1>`
7+
})
8+
export class AppComponent { }

‎public/docs/_examples/setup/ts/app/app.module.ts

+11
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,11 @@
1+
// #docregion
2+
import { NgModule } from '@angular/core';
3+
import { BrowserModule } from '@angular/platform-browser';
4+
import { AppComponent } from './app.component';
5+
6+
@NgModule({
7+
imports: [ BrowserModule ],
8+
declarations: [ AppComponent ],
9+
bootstrap: [ AppComponent ]
10+
})
11+
export class AppModule { }

‎public/docs/_examples/setup/ts/app/main.ts

+6
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,6 @@
1+
// #docregion
2+
import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
3+
import { AppModule } from './app.module';
4+
platformBrowserDynamic().bootstrapModule(AppModule);
5+
6+
/* This file is excluded in plunkers */

‎public/docs/_examples/setup/ts/example-config.json

Whitespace-only changes.

‎public/docs/_examples/setup/ts/index.html

+33
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,33 @@
1+
<!DOCTYPE html>
2+
<!-- #docregion -->
3+
<html>
4+
<head>
5+
<title>Hello Angular</title>
6+
<meta charset="UTF-8">
7+
<meta name="viewport" content="width=device-width, initial-scale=1">
8+
<link rel="stylesheet" href="styles.css">
9+
<style>
10+
body {color:#369;font-family: Arial,Helvetica,sans-serif;}
11+
</style>
12+
13+
<!-- #docregion polyfills -->
14+
<!-- Polyfill for older browsers -->
15+
<script src="node_modules/core-js/client/shim.min.js"></script>
16+
<!-- #enddocregion polyfills -->
17+
18+
<script src="node_modules/zone.js/dist/zone.js"></script>
19+
<script src="node_modules/reflect-metadata/Reflect.js"></script>
20+
<script src="node_modules/systemjs/dist/system.src.js"></script>
21+
<script src="systemjs.config.js"></script>
22+
<script>
23+
System.import('app').catch(function(err){ console.error(err); });
24+
</script>
25+
</head>
26+
27+
<body>
28+
<!-- #docregion my-app-->
29+
<my-app><!-- content managed by Angular --></my-app>
30+
<!-- #enddocregion my-app-->
31+
</body>
32+
33+
</html>

‎public/docs/_examples/setup/ts/plnkr.json

+10
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,10 @@
1+
{
2+
"description": "QuickStart Setup",
3+
"files": [
4+
"app/app.component.ts",
5+
"app/app.module.ts",
6+
"app/main.ts",
7+
"index.html"
8+
],
9+
"tags": ["quickstart setup"]
10+
}

‎public/docs/ts/latest/guide/attribute-directives.jade

+2-2
Original file line numberDiff line numberDiff line change
@@ -64,8 +64,8 @@ a#write-directive
6464

6565
:marked
6666
### Write the directive code
67-
Follow the [Setup](setup.html) instructions for creating a new project
68-
and name the project folder <ngio-ex path="attribute-directives"></ngio-ex>.
67+
Follow the [setup](setup.html) instructions for creating a new project
68+
named <ngio-ex path= <ngio-ex path="attribute-directives"></ngio-ex>.
6969

7070
:marked
7171
Create the following source file in the indicated folder with the following code:

‎public/docs/ts/latest/guide/displaying-data.jade

+2-2
Original file line numberDiff line numberDiff line change
@@ -35,8 +35,8 @@ figure.image-display
3535
With interpolation, you put the property name in the view template, enclosed in double curly braces: `{{myHero}}`.
3636

3737

38-
Follow the [Setup](setup.html) instructions for creating a new project
39-
and name the project folder <ngio-ex path="displaying-data"></ngio-ex>.
38+
Follow the [setup](setup.html) instructions for creating a new project
39+
named <ngio-ex path= <ngio-ex path="displaying-data"></ngio-ex>.
4040

4141
:marked
4242
Then modify the <ngio-ex path="app.component.ts"></ngio-ex> file by

‎public/docs/ts/latest/guide/forms.jade

+3-3
Original file line numberDiff line numberDiff line change
@@ -85,9 +85,9 @@ figure.image-display
8585

8686
:marked
8787
## Setup
88-
Follow the [Setup](setup.html) instructions for creating a new project
89-
and name the project folder <ngio-ex path="angular-forms"></ngio-ex>.
90-
:marked
88+
Follow the [setup](setup.html) instructions for creating a new project
89+
named <ngio-ex path=<ngio-ex path="angular-forms"></ngio-ex>.
90+
9191
## Create the Hero Model Class
9292

9393
As users enter form data, we capture their changes and update an instance of a model.

0 commit comments

Comments
 (0)