36 lines
779 B
TypeScript
36 lines
779 B
TypeScript
|
import {Component, Directive, EventEmitter , ElementRef} from 'angular2/core';
|
||
|
|
|
||
|
|
import {Hero} from './hero';
|
||
|
|
import {InitCapsPipe} from './init-caps-pipe';
|
||
|
|
|
||
|
|
@Directive({selector: 'button'})
|
||
|
|
class DecoratorDirective {
|
||
|
|
constructor(el: ElementRef){
|
||
|
|
console.log(el)
|
||
|
|
}
|
||
|
|
}
|
||
|
|
@Component({
|
||
|
|
selector: 'my-hero-detail',
|
||
|
|
templateUrl: 'app/hero-detail.component.html',
|
||
|
|
inputs: ['hero', 'userName'], // inputs
|
||
|
|
outputs: ['delete'], // outputs
|
||
|
|
directives: [DecoratorDirective],
|
||
|
|
styleUrls: ['app/hero-detail.component.css'],
|
||
|
|
pipes: [InitCapsPipe]
|
||
|
|
})
|
||
|
|
export class HeroDetailComponent {
|
||
|
|
|
||
|
|
hero: Hero;
|
||
|
|
|
||
|
|
delete = new EventEmitter();
|
||
|
|
|
||
|
|
onDelete() { this.delete.next(this.hero) }
|
||
|
|
|
||
|
|
onUpdate() {
|
||
|
|
if (this.hero) {
|
||
|
|
this.hero.name += 'x';
|
||
|
|
}
|
||
|
|
}
|
||
|
|
userName: string;
|
||
|
|
}
|