कोणीय 2 परीक्षण - असफल: संकोच (वादे में): त्रुटि: टेम्पलेट पार्स त्रुटियां: 'संदेश' से बंधे नहीं जा सकते हैं क्योंकि यह

Question

की ज्ञात संपत्ति नहीं है मेरे पास दो घटक हैं जो एक दूसरे का उपयोग करते हैं।

पहले एक है: "GamePanelComponent"जो html फ़ाइल जिसमें है: "my-game-panel-output" टैग

दूसरा एक है:

import { Component, Input } from '@angular/core'; 

@Component({ 
    moduleId: module.id, 
    selector: 'my-game-panel-output', 
    templateUrl: 'gamepaneloutput.component.html', 
    styleUrls: [ 'gamepaneloutput.component.css' ] 
}) 

export class GamePanelOutputComponent { 
    @Input() 
    message: string; 
} 

मैं एक परीक्षण लिखा GamePanelComponent रहे हैं:

import { ComponentFixture, TestBed, async } from '@angular/core/testing'; 
import { By }    from '@angular/platform-browser'; 
import { DebugElement } from '@angular/core'; 

import { GamePanelComponent } from './gamepanel.component'; 
import { GamePanelOutputComponent } from '../gamepaneloutput/gamepaneloutput.component'; 

describe('GamePanelComponent (inline template)',() => { 

    let comp: GamePanelComponent; 
    let fixture: ComponentFixture<GamePanelComponent>; 

    beforeEach(async (() => { 

    TestBed.configureTestingModule({ 
     declarations: [ GamePanelComponent ], // declare the test component 
    }).compileComponents() 
     .then(() => { 
      fixture = TestBed.createComponent(GamePanelComponent);    
      comp = fixture.componentInstance; 
     }); 
    })); 

    it('isValidMove',() => { 
     comp.ngOnInit();  
     let isValid = comp.isValidMove(0,0); 
     expect(isValid).toBe(false); 
    }); 

}); 

दुर्भाग्यवश, परीक्षण इस त्रुटि के साथ विफल रहता है:

Failed: Uncaught (in promise): Error: Template parse errors: 
Can't bind to 'message' since it isn't a known property of 'my-game-panel-output'. 

जैसा कि आप देख सकते हैं कि मैंने "GamePanelOutputComponent" आयात करने का प्रयास किया है और इससे मदद नहीं मिलती है।

मैं वास्तव में इस पर अटक गया हूं। क्या कोई सहायता कर सकता है?

Answer 1

आप अपने GamePanelComponent परीक्षण करने के लिए जा रहा है और टेम्पलेट में अपने <my-game-panel-output> रखा जाता है, अपने GamePanelOutputComponent अब GamePanelComponent का एक बच्चा घटक है। चूंकि आपका <my-game-panel-output> एक कस्टम HTML तत्व कोणीय नहीं जानता है कि इसके साथ क्या किया जाए। इसलिए आपको घोषित करना होगा।

के लिए अपने घटक घोषित करने के लिए सक्षम होने के लिए आप import यह करने के लिए पहले होगा, जैसे आप पहले से ही किया है:

import { GamePanelOutputComponent } from '../gamepaneloutput/gamepaneloutput.component'; 

अब आपके पास की declarations में घोषित करने के लिए अपने GamePanelOutputComponent अपने TestBed.configureTestingModule()।

... declarations: [ GamePanelComponent, GamePanelOutputComponent ], ...

---

जब अपने बच्चे घटक एक Module (जैसे <md-icon> फार्म @angular/material) का हिस्सा है तो आप सिर्फ import कर सकते हैं पूरे मॉड्यूल।

// Material Design Assets 
import { MaterialModule } from '@angular/material'; 

इसका इस्तेमाल करने के लिए आप आयात करना होगा यह आपके अपने TestBed.configureTestingModule() की imports में GamePanelOutputComponent। मॉड्यूल में सभी सामग्री घटक पहले से ही घोषित किए गए हैं, इसलिए उन्हें फिर से घोषित करने की आवश्यकता नहीं है।

... imports: [ MaterialModule.forRoot() ], ...