github/JavaScriptServices
1
1
Fork 0
mirror of https://github.com/aspnet/JavaScriptServices.git synced 2025-12-23 01:58:29 +00:00
Code Issues Packages Projects Releases Wiki Activity

Update Angular 2 Music Store sample to latest Angular 2 and other dependencies. Switch from asp-ng2-prerender-module to the more general asp-prerender-module.

Browse Source
This commit is contained in:
SteveSandersonMS
2016-04-08 13:54:41 +01:00
parent 532da3de9f
commit 18a165d6f4
22 changed files with 754 additions and 59 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
samples/angular/MusicStore/wwwroot/ng-app/components/app/bootstrap.ts → samples/angular/MusicStore/wwwroot/ng-app/boot-client.ts
View File

@@ -3,6 +3,6 @@ import { FormBuilder } from 'angular2/common';
import * as router from 'angular2/router';
import { Http, HTTP_PROVIDERS } from 'angular2/http';
import { CACHE_PRIMED_HTTP_PROVIDERS } from 'angular2-aspnet';
import { App } from './app';
import { App } from './components/app/app';
bootstrap(App, [router.ROUTER_BINDINGS, HTTP_PROVIDERS, CACHE_PRIMED_HTTP_PROVIDERS, FormBuilder]);

29
samples/angular/MusicStore/wwwroot/ng-app/boot-server.ts Normal file
View File

@@ -0,0 +1,29 @@
import 'angular2-universal/polyfills';
import { FormBuilder } from 'angular2/common';
import * as ngCore from 'angular2/core';
import * as ngRouter from 'angular2/router';
import * as ngUniversal from 'angular2-universal';
import { App } from './components/app/app';
export default function (params: any): Promise<{ html: string, globals?: any }> {
const serverBindings = [
ngCore.provide(ngUniversal.BASE_URL, { useValue: params.absoluteUrl }),
ngCore.provide(ngUniversal.REQUEST_URL, { useValue: params.url }),
ngCore.provide(ngRouter.APP_BASE_HREF, { useValue: '/' }),
ngUniversal.NODE_HTTP_PROVIDERS,
ngUniversal.NODE_ROUTER_PROVIDERS,
FormBuilder
];
return ngUniversal.bootloader({
directives: [App],
providers: serverBindings,
async: true,
preboot: false,
// TODO: Render just the <app> component instead of wrapping it inside an extra HTML document
// Waiting on https://github.com/angular/universal/issues/347
template: '<!DOCTYPE html>\n<html><head></head><body><app></app></body></html>'
}).serializeApplication().then(html => {
return { html };
});
}

8
samples/angular/MusicStore/wwwroot/ng-app/components/admin/admin-home/admin-home.ts
View File

@@ -5,17 +5,15 @@ import { AlbumDetails } from '../album-details/album-details';
import { AlbumEdit } from '../album-edit/album-edit';
@ng.Component({
selector: 'admin-home'
selector: 'admin-home',
templateUrl: './ng-app/components/admin/admin-home/admin-home.html',
directives: [router.ROUTER_DIRECTIVES]
})
@router.RouteConfig([
{ path: 'albums', name: 'Albums', component: AlbumsList },
{ path: 'album/details/:albumId', name: 'AlbumDetails', component: AlbumDetails },
{ path: 'album/edit/:albumId', name: 'AlbumEdit', component: AlbumEdit }
])
@ng.View({
templateUrl: './ng-app/components/admin/admin-home/admin-home.html',
directives: [router.ROUTER_DIRECTIVES]
})
export class AdminHome {
}

4
samples/angular/MusicStore/wwwroot/ng-app/components/admin/album-delete-prompt/album-delete-prompt.ts
View File

@@ -2,9 +2,7 @@ import * as ng from 'angular2/core';
import * as models from '../../../models/models';
@ng.Component({
selector: 'album-delete-prompt'
})
@ng.View({
selector: 'album-delete-prompt',
templateUrl: './ng-app/components/admin/album-delete-prompt/album-delete-prompt.html'
})
export class AlbumDeletePrompt {

4
samples/angular/MusicStore/wwwroot/ng-app/components/admin/album-details/album-details.ts
View File

@@ -5,9 +5,7 @@ import { Http, HTTP_BINDINGS } from 'angular2/http';
import { AlbumDeletePrompt } from '../album-delete-prompt/album-delete-prompt';
@ng.Component({
selector: 'album-details'
})
@ng.View({
selector: 'album-details',
templateUrl: './ng-app/components/admin/album-details/album-details.html',
directives: [router.ROUTER_DIRECTIVES, AlbumDeletePrompt]
})

4
samples/angular/MusicStore/wwwroot/ng-app/components/admin/album-edit/album-edit.ts
View File

@@ -9,9 +9,7 @@ import { FormField } from '../form-field/form-field';
import * as AspNet from 'angular2-aspnet';
@ng.Component({
selector: 'album-edit'
})
@ng.View({
selector: 'album-edit',
templateUrl: './ng-app/components/admin/album-edit/album-edit.html',
directives: [router.ROUTER_DIRECTIVES, AlbumDeletePrompt, FormField, FORM_DIRECTIVES]
})

4
samples/angular/MusicStore/wwwroot/ng-app/components/admin/albums-list/albums-list.ts
View File

@@ -5,9 +5,7 @@ import * as models from '../../../models/models';
import { AlbumDeletePrompt } from '../album-delete-prompt/album-delete-prompt';
@ng.Component({
selector: 'albums-list'
})
@ng.View({
selector: 'albums-list',
templateUrl: './ng-app/components/admin/albums-list/albums-list.html',
directives: [router.ROUTER_DIRECTIVES, AlbumDeletePrompt]
})

4
samples/angular/MusicStore/wwwroot/ng-app/components/admin/form-field/form-field.ts
View File

@@ -3,9 +3,7 @@ import { AbstractControl } from 'angular2/common';
@ng.Component({
selector: 'form-field',
properties: ['label', 'validate']
})
@ng.View({
properties: ['label', 'validate'],
templateUrl: './ng-app/components/admin/form-field/form-field.html'
})
export class FormField {

10
samples/angular/MusicStore/wwwroot/ng-app/components/app/app.ts
View File

@@ -9,7 +9,10 @@ import { AdminHome } from '../admin/admin-home/admin-home';
import * as models from '../../models/models';
@ng.Component({
selector: 'app'
selector: 'app',
templateUrl: './ng-app/components/app/app.html',
styleUrls: ['./ng-app/components/app/app.css'],
directives: [router.ROUTER_DIRECTIVES]
})
@router.RouteConfig([
{ path: '/', component: Home, name: 'Home' },
@@ -18,11 +21,6 @@ import * as models from '../../models/models';
{ path: '/genres', component: GenresList, name: 'GenresList' },
{ path: '/admin/...', component: AdminHome, name: 'Admin' }
])
@ng.View({
templateUrl: './ng-app/components/app/app.html',
styleUrls: ['./ng-app/components/app/app.css'],
directives: [router.ROUTER_DIRECTIVES]
})
export class App {
public genres: models.Genre[];

4
samples/angular/MusicStore/wwwroot/ng-app/components/public/album-details/album-details.ts
View File

@@ -4,9 +4,7 @@ import { Http } from 'angular2/http';
import * as models from '../../../models/models';
@ng.Component({
selector: 'album-details'
})
@ng.View({
selector: 'album-details',
templateUrl: './ng-app/components/public/album-details/album-details.html'
})
export class AlbumDetails {

4
samples/angular/MusicStore/wwwroot/ng-app/components/public/album-tile/album-tile.ts
View File

@@ -4,9 +4,7 @@ import * as models from '../../../models/models';
@ng.Component({
selector: 'album-tile',
properties: ['albumData']
})
@ng.View({
properties: ['albumData'],
templateUrl: './ng-app/components/public/album-tile/album-tile.html',
directives: [router.ROUTER_DIRECTIVES]
})

4
samples/angular/MusicStore/wwwroot/ng-app/components/public/genre-contents/genre-contents.ts
View File

@@ -5,9 +5,7 @@ import * as models from '../../../models/models';
import { AlbumTile } from '../album-tile/album-tile';
@ng.Component({
selector: 'genre-contents'
})
@ng.View({
selector: 'genre-contents',
templateUrl: './ng-app/components/public/genre-contents/genre-contents.html',
directives: [AlbumTile]
})

4
samples/angular/MusicStore/wwwroot/ng-app/components/public/genres-list/genres-list.ts
View File

@@ -4,9 +4,7 @@ import { Http } from 'angular2/http';
import * as models from '../../../models/models';
@ng.Component({
selector: 'genres-list'
})
@ng.View({
selector: 'genres-list',
templateUrl: './ng-app/components/public/genres-list/genres-list.html',
directives: [router.ROUTER_DIRECTIVES]
})

4
samples/angular/MusicStore/wwwroot/ng-app/components/public/home/home.ts
View File

@@ -4,9 +4,7 @@ import { AlbumTile } from '../album-tile/album-tile';
import * as models from '../../../models/models';
@ng.Component({
selector: 'home'
})
@ng.View({
selector: 'home',
templateUrl: './ng-app/components/public/home/home.html',
directives: [AlbumTile]
})