2 Eğik, bağımlılık enjeksiyonu ile gizem kendimi (ağır benim 2 uygulamasına) bir NG2 uzmanı ve henüz her seferinde bir süre içinde burada gereken bir nokta girmek ... ve olacağını düşünün

Question

Bir var bir

olduğunu simpleGridTable denilen basit tablo bileşeni:

<tr class="simpleGridRecord" [table]="userSimpleGridTable" simpleGridRecord *ngFor="#item of m_businesses | OrderBy:sort.field:sort.desc; #index=index" [item]="item" [index]="index"> 

: bunun içinde

<simpleGridTable #userSimpleGridTable> 
<thead> 
<tr> 
    <th sortableHeader="name" [sort]="sort">name</th> 
    <th sortableHeader="businessId" [sort]="sort">business</th> 
    <th>access keys [0-7]</th> 
    <th>privileges (id)</th> 
    <th>privileges (name)</th> 
</tr> 
</thead> 
<tbody> 
<tr class="simpleGridRecord" [table]="userSimpleGridTable" simpleGridRecord *ngFor="#item of m_businesses | OrderBy:sort.field:sort.desc; #index=index" [item]="item" [index]="index"> 
    <td style="width: 20%" simpleGridData (labelEdited)="onLabelEdited($event,'name')" editable="true" field="name" [item]="item"></td> 
    <td style="width: 8%" simpleGridData field="businessId" [item]="item"></td> 
    <td style="width: 20%" simpleGridDataChecks (changed)="setAccessMask($event)" [item]="item" [checkboxes]="getAccessMask(item)"></td> 
    <td style="width: 12%" simpleGridData field="privilegeId" [item]="item"></td> 
    <td style="width: 40%" simpleGridDataDropdown [testSelection]="selectedPriveleges()" (changed)="setPriveleges($event)" field="name" [item]="item" [dropdown]="m_priveleges"></td> 
    <!-- <td simpleGridDataImage color="dodgerblue" [field]="item.getKey('studioLite') == '0' ? 'fa-circle' : 'fa-circle-o'" [item]="item"></td> --> 
</tr> 
</tbody> 

sana yukarıda onun direktifi görebileceğiniz bir simpleGridRecord var

simpleGridRecord bileşeni aşağıdaki şekilde (ve üst SimpleGridTable enjekte bağımlılık için çalışılan:

import {Component, Injectable, Input, Output, ChangeDetectionStrategy, HostListener, HostBinding, EventEmitter} from 'angular2/core' 

içe {SimpleGridTable} "./SimpleGridTable" den;

@Component({ 
     selector: 'tr[simpleGridRecord]', 
     changeDetection: ChangeDetectionStrategy.OnPush, 
     template: ` 
      <ng-content></ng-content> 
    ` 
}) 
export class SimpleGridRecord { 

    constructor(tb:SimpleGridTable){ 
     console.log(tb); 
    } 
    .... 

ve benim SimpleGridTable bileşen:

@Component({ 
selector: 'simpleGridTable', 
changeDetection: ChangeDetectionStrategy.OnPush, 
providers: [SimpleGridTable], 
pipes: [OrderBy], 
directives: [COMMON_DIRECTIVES, SimpleGridSortableHeader, SimpleGridRecord, SimpleGridData], 
styleUrls: [`../comps/simplegrid/SimpleGrid.css`], 
template: ` 
    <table class="table simpleTable"> 
     <ng-content></ng-content> 
    </table>  
`.... 
}) 
export class SimpleGridTable { 
... 

ve ben bir hata alıyorum henüz simpleGridRecord üst tablosunu enjekte edebilmek için görünmüyor:

I TypeInfo kullanıyorum olarak @Inject kullanmayın ... Tabloyu kendi verdikleri yere [sağla] yapıyorum

tüm sınıfburada görülebilir: https://github.com/born2net/studioDashboard/tree/master/src/comps/simplegrid

tx

Sean bir çocuk içine bir üst enjekte ediyorlar her

Answer 1

, okumak için ebeveyn ve çocuk farklı tanımlanmıştır özellikle dosyalar, çok büyük olasılıkla şöyle bir forwardRef çocuk sınıfta üst sınıfa herhangi bir referans sarmak gerekir:

constructor(@Inject(forwardRef(() => SimpleGridTable) tb: SimpleGridTable){ 
    console.log(tb); 
} 

Bu, alt sınıfın (önce yüklenecek olan) alt sınıfının yüklenmesi sırasında yüklenmesinin imkansız olması için bir geçici çözümdür. Ayrıca

,

Ben typescript kullanıyorum ben @ Enjekte kullanmayın

... Ben onun decedents için koşullar nerede @Inject olduğunu

Not tablosunu [sunmak] do Typescript uygulamalarında gereklidir - bu onlardan biri.

Ayrıca, burada yaptığınız gibi, providers'da bulunan bir bileşen türünü daha önce hiç görmediğimi ve bunu yaptığınızı düşündüğünüzü yaptığınızı doğrulamanızı tavsiye ederim. Her durumda, FWIW, bununla yaptığınız şey, kodunuzun bir okuyucusu olarak bana açık değildir ve yapıcı enjeksiyonu ile @Inject'u kullanan IMHO, ana bileşenleri çocuklarına enjekte etmek için daha temiz ve daha idiyic bir yaklaşımdır.