+
+ 
npm run start:hmr+
this.localState = {{ localState | json }}
+ `
+})
+export class AboutComponent implements OnInit {
+
+ public localState: any;
+ constructor(
+ public route: ActivatedRoute
+ ) {}
+
+ public ngOnInit() {
+ this.route
+ .data
+ .subscribe((data: any) => {
+ /**
+ * Your resolved data from route.
+ */
+ this.localState = data.yourData;
+ });
+
+ console.log('hello `About` component');
+ /**
+ * static data that is bundled
+ * var mockData = require('assets/mock-data/mock-data.json');
+ * console.log('mockData', mockData);
+ * if you're working with mock data you can also use http.get('assets/mock-data/mock-data.json')
+ */
+ this.asyncDataWithWebpack();
+ }
+ private asyncDataWithWebpack() {
+ /**
+ * you can also async load mock data with 'es6-promise-loader'
+ * you would do this if you don't want the mock-data bundled
+ * remember that 'es6-promise-loader' is a promise
+ */
+ setTimeout(() => {
+
+ import('../../assets/mock-data/mock-data.json')
+ .then((json) => {
+ console.log('async mockData', json);
+ this.localState = json;
+ });
+
+ });
+ }
+
+}
diff --git a/src/app/about/index.ts b/src/app/about/index.ts
new file mode 100644
index 0000000000..b7cb92aea6
--- /dev/null
+++ b/src/app/about/index.ts
@@ -0,0 +1 @@
+export * from './about.component';
diff --git a/src/app/app.component.css b/src/app/app.component.css
new file mode 100644
index 0000000000..f78b9d9d28
--- /dev/null
+++ b/src/app/app.component.css
@@ -0,0 +1,8 @@
+html, body{
+ height: 100%;
+ font-family: Arial, Helvetica, sans-serif
+}
+
+a.active {
+ background-color: gray;
+}
diff --git a/src/app/app.component.spec.ts b/src/app/app.component.spec.ts
new file mode 100644
index 0000000000..866abe6b04
--- /dev/null
+++ b/src/app/app.component.spec.ts
@@ -0,0 +1,66 @@
+import { NO_ERRORS_SCHEMA } from '@angular/core';
+import {
+ inject,
+ async,
+ TestBed,
+ ComponentFixture
+} from '@angular/core/testing';
+
+/**
+ * Load the implementations that should be tested
+ */
+import { AppComponent } from './app.component';
+import { AppState } from './app.service';
+
+describe(`App`, () => {
+ let comp: AppComponent;
+ let fixture: ComponentFixturethis.appState.state = {{ appState.state | json }}
+
+
+ `
+})
+export class AppComponent implements OnInit {
+ public name = 'Angular Starter';
+ public tipe = 'assets/img/tipe.png';
+ public twitter = 'https://twitter.com/gdi2290';
+ public url = 'https://tipe.io';
+ public showDevModule: boolean = environment.showDevModule;
+
+ constructor(
+ public appState: AppState
+ ) {}
+
+ public ngOnInit() {
+ console.log('Initial App State', this.appState.state);
+ }
+
+}
+
+/**
+ * Please review the https://github.com/AngularClass/angular-examples/ repo for
+ * more angular app examples that you may copy/paste
+ * (The examples may not be updated as quickly. Please open an issue on github for us to update it)
+ * For help or questions please contact us at @AngularClass on twitter
+ * or our chat on Slack at https://AngularClass.com/slack-join
+ */
diff --git a/src/app/app.e2e.ts b/src/app/app.e2e.ts
new file mode 100644
index 0000000000..368de16db5
--- /dev/null
+++ b/src/app/app.e2e.ts
@@ -0,0 +1,34 @@
+import { browser, by, element } from 'protractor';
+import 'tslib';
+
+describe('App', () => {
+
+ beforeEach(async () => {
+ await browser.get('/');
+ });
+
+ it('should have a title', async () => {
+ const subject = await browser.getTitle();
+ const result = 'Angular Starter by @gdi2290 from @TipeIO';
+ expect(subject).toEqual(result);
+ });
+
+ it('should have header', async () => {
+ const subject = await element(by.css('h1')).isPresent();
+ const result = true;
+ expect(subject).toEqual(result);
+ });
+
+ it('should have npm run start:hmr+
this.localState = {{ localState | json }}
+
+ this.title = {{ title | json }}
-