Köşeli 2 - ngOnInit yaşam döngüsü kancasında kullanılan bir girişle test etme

Question

Şu anda, ana bilgisayar bileşeninden bir girdi kabul eden ve aşağıdaki kod gibi ngOnInit yaşam döngüsü kancasında kullanılan bir alt bileşeni test etmeye çalışıyorum.

@Component({ 
    selector: 'my-child-component', 
    template: '<div></div>' 
}) 
class ChildComponent implements OnInit { 
    @Input() myValue: MyObject; 
    transformedValue: SomeOtherObject; 

    ngOnInit():void { 
     // Do some data transform requiring myValue 
     transformedValue = ...; 
    } 
} 

@Component({ 
    template:`<my-child-component [myValue]="someValue"></my-child-component>` 
}) 
class HostComponent { 
    someValue: MyObject = new MyObject(); // how it is initialized it is not important. 
} 

Nasıl

ChildComponent MyValue iddiasına ilişkin ChildComponent.transformedValue erişmesini mümkün olurken oluşturulması sırasında mevcut olması gerekir, bu durumda test edilmelidir.

Ben ngOnInit zaten ben de oluşturma çalıştı

fixture.componentInstance.myValue = someValue; 

diyoruz noktaya kadar denilen olurdu ancak bu

componentFixture = testBed.createComponent(LoginFormComponent) 

gibi Açısal TestBed sınıfını kullanarak ChildComponent oluşturma çalıştı HostComponent bir fikstür ve bu çalışırken, ChildComponent.transformedValue alanında iddiaları gerçekleştirmek için gerekli olan ChildComponent örneğine erişim elde sıkışmış.

Yardımı büyük beğeni topluyor!

Çok teşekkürler!

Answer 1

Açısal, @ViewChild() dekoratörünü kullanarak alt bileşenleri ana bileşenlerine enjekte etme olanağı sunar. iddiasını yapım aşağıdaki

@Component({ 
    template:`<my-child-component [myValue]="someValue"></my-child-component>` 
}) 
class TestHostComponent { 
    @ViewChild(MyChildComponent) 
    childComponent: MyChildComponent; 
} 

onun çocuk bileşeni örneği (ve değişkenleri) ortaya çıkarır için TestHostcomponent (yani .spec.ts dosya içinde yazılır) güncelleyerek https://angular.io/docs/ts/latest/cookbook/component-communication.html#!#parent-to-view-child

Bkz ' transformedValue ', aşağıdaki gibi mümkündür. Eğer `@ Input` değerini değiştirirseniz bu soruyu yararlı olabilir böylece

componentFixture = testBed.createComponent(TestHostComponent) 
expect(componentFixture.componentInstance.childComponent.transformedValue).toEqual(...someValue);