Jak mogę przekazać ogólny parametr typu do składnika Angular2?

Question

Powiedzmy mam składnik o stałej wejściowego typu parametru,

@Component({ 
    selector: 'fixed', 
    template: '<div>{{value}}</div>' 
}) 
export class FixedComponent { 
    @Input() value: string; 
} 

Jak mam iść na temat tworzenia tego typu parametru generycznych, czyli

@Component({ 
    selector: 'generic', 
    template: '<div>{{value}}</div>' 
}) 
export class GenericComponent<T> { 
    @Input() value: T; 
} 

to znaczy w jaki sposób mogę przekazać typ w szablonie komponentu nadrzędnego?

<generic ...></generic> 

Answer 1

Ja tylko gra z kanciasty i zrobiłem tej pracy za pomocą ViewChild, poprzez wewnętrzny i zewnętrzny komponent.

W wewnętrznej deklaracji komponentu składnika jest jak:

@Injectable() 
@Component({ 
selector: 'inner-selector', 
templateUrl: ..., 
styleUrls: ..., 
directives: [ 
...] 
export class InnerComponent**<T>** ... 

w składniku zewnętrznej który nazywany przez router robiłam:

import {Component} from '@angular/core'; 
import {InnerComponent} from '../components/inner.component'; 
import {ViewChild } from '@angular/core'; 

@Component({ 
    selector:  'demo-app', 
    template: '<inner-selector></inner-selector>', 
directives: [InnerComponent] 
}) 
export class TestPage { 

    @ViewChild(InnerComponent) 
    **private innerComponent:InnerComponent<MPSalesHeader>;** 
}; 

nie wiem czy to jest dobry sposób, ale pracował.

Pozdrawiam!

Answer 2

Wygląda na to, że można używać ogólnych parametrów typu w elementach potomnych Angular 2.

@Component({ 
    selector: 'app-child', 
    template: '<p>Generic Child</p><p>{{cp}}</p>' 
}) 
export class GenericChildComponent<T> { 
    @Input() cp: T; 
} 

import { GenericChildComponent } from './generic-child.component'; 
@Component({ 
    selector: 'app-root', 
    template: '<app-child [cp]="p1"></app-child><hr /><app-child [cp]="p2"></app-child>', 
    directives: [GenericChildComponent] 
}) 
export class ParentComponent { 
    p1: string = 'property 1'; 
    p2: number = 100; 
} 

Działa to bez uciekania się zarówno do techniki ViewChild zasugerował above lub techniką klasy bazowej sugeruje here.

Answer 3

Wygląda na to, że przy korzystaniu z AOT compilation jedynym sposobem na to jest zastąpienie ogólnego typu "dowolnym". Zobacz https://github.com/angular/angular/issues/11057