Skip to content

Instantly share code, notes, and snippets.

Gábor Soós blacksonic

Block or report user

Report or block blacksonic

Hide content and notifications from this user.

Learn more about blocking users

Contact Support about this user’s behavior.

Learn more about reporting abuse

Report abuse
View GitHub Profile
@blacksonic
blacksonic / component-relative-paths-webpack.ts
Created Jun 9, 2016
Component-Relative paths in Angular 2 for Webpack
View component-relative-paths-webpack.ts
import { Component } from '@angular/core';
import headerTemplate from './header.component.html';
import headerStyle from './header.component.css';
@Component({
selector: 'my-app',
template: headerTemplate,
styles: [headerStyle]
})
export class HeaderComponent implements OnInit {
@blacksonic
blacksonic / app.component.ts
Last active Jun 24, 2016
Upgrading to the new Angular 2 router - part 1
View app.component.ts
// components/app/app.component.ts
import { Component } from '@angular/core';
import { RouteConfig, ROUTER_DIRECTIVES } from '@angular/router-deprected';
import { HeroesComponent } from './components/heroes/heroes.component';
import { HeroDetailComponent } from '../hero-detail/hero-detail.component';
@RouteConfig([
{
path: '/',
@blacksonic
blacksonic / routes.ts
Created Jun 24, 2016
Upgrading to the new Angular 2 router - part 2
View routes.ts
// routes.ts
import { provideRouter, RouterConfig } from '@angular/router';
import { HeroesComponent } from './components/heroes/heroes.component';
import { HeroDetailComponent } from './components/hero-detail/hero-detail.component';
export const appRoutes: RouterConfig = [
{ path: '', component: HeroesComponent, terminal: true },
{ path: 'detail/:id', component: HeroDetailComponent }
];
@blacksonic
blacksonic / main.ts
Created Jun 24, 2016
Upgrading to the new Angular 2 router - part 3
View main.ts
// main.ts
import { ROUTER_PROVIDERS } from '@angular/router-deprecated';
import { AppComponent } from './components/app/app.component';
bootstrap(AppComponent, [
ROUTER_PROVIDERS
]);
@blacksonic
blacksonic / main.ts
Created Jun 24, 2016
Upgrading to the new Angular 2 router - part 4
View main.ts
// main.ts
import { APP_ROUTER_PROVIDER } from './routes';
import { AppComponent } from './components/app/app.component';
bootstrap(AppComponent, [
APP_ROUTER_PROVIDER
]);
@blacksonic
blacksonic / routes.html
Created Jun 24, 2016
Upgrading to the new Angular 2 router - part 5
View routes.html
<a [routerLink]="['/Heroes']">Heroes</a>
<a [routerLink]="['/HeroDetail', { id: 1 }]">Captain America</a>
@blacksonic
blacksonic / routes.html
Created Jun 24, 2016
Upgrading to the new Angular 2 router - part 6
View routes.html
<a [routerLink]="['']">Heroes</a>
<a [routerLink]="['detail', 1]">Captain America</a>
@blacksonic
blacksonic / redirect.ts
Created Jun 24, 2016
Upgrading to the new Angular 2 router - part 7
View redirect.ts
// navigates to Captain America's page
this.router.navigate(['detail', 1]);
@blacksonic
blacksonic / hero-detail.component.ts
Created Jun 24, 2016
Upgrading to the new Angular 2 router - part 8
View hero-detail.component.ts
// components/hero-detail/hero-detail.component.ts
import { Component, OnInit } from '@angular/core';
import { RouteParams } from '@angular/router-deprected';
import { HeroService } from '../../services/hero/hero.service'
@Component({ ... })
export class HeroDetailComponent implements OnInit {
constructor(private params: RouteParams, private heroService: HeroService) {}
@blacksonic
blacksonic / hero-detail.component.ts
Created Jun 24, 2016
Upgrading to the new Angular 2 router - part 9
View hero-detail.component.ts
// components/hero-detail/hero-detail.component.ts
import { Component, OnInit } from '@angular/core';
import { ActivatedRoute } from '@angular/router';
import { HeroService } from '../../services/hero/hero.service'
@Component({ ... })
export class HeroDetailComponent implements OnInit {
constructor(private route: ActivatedRoute, private heroService: HeroService) {}
You can’t perform that action at this time.