2015-09-22 4 views
5

मैं सिर्फ Angularjs2.0 का परीक्षण कर रहा हूं लेकिन मैं कक्षा में सेवा इंजेक्शन देने में समस्या में भाग रहा हूं।घटक इंजेक्शन Angularjs2

EXCEPTION: Error during instantiation of Token(Promise<ComponentRef>)!. ORIGINAL EXCEPTION: Cannot resolve all parameters for MeetingFormComponent(undefined). Make sure they all have valid type or annotations.

मैं डॉक्स पर देख रहा हूँ और ऐसा लगता है कि है वास्तव में कैसे वे अपनी सेवा इंजेक्शन कर रहे हैं:

import {Component, View, bootstrap, NgFor, HttpService, Promise} from 'angular2/angular2'; 

@Component({ 
    selector: 'meeting-form', 
    appInjector: [MeetingService] 
}) 

@View({ 
    template: ` 
     <ul> 
      <li *ng-for="#meeting of meetings"> 
       Meeting Room: meeting room {{meeting.room}} 
       Date: {{meeting.date}} 
       Time: {{meeting.time}} 
      </li> 
     </ul> 
      <select #room> 
       <option value="1">Meeting Room 1</option> 
       <option value="2">Meeting Room 2</option> 
      </select> 
      <input type="date" #date> 
      <input type="time" #time> 
      <button (click)="reserveMeeting(room.value, date.value, time.value)">Reserve</button> 

    `, 
    directives: [NgFor] 
}) 

class MeetingFormComponent{ 
    meetings: Array; 

    constructor(meetingService: MeetingService){ 
     this.meetings = meetingService.getMeetings(); 
    } 

    reserveMeeting(room: number, date: string, time: string, meetingService: MeetingService){ 
     meetingService.postMeeting(room, date, time); 
    } 
} 

class MeetingService { 
    http: HttpService; 

    constructor(http: HttpService) { 
     this.http = http; 
    } 
    getMeetings() { 
     return this.http.get('/meetings').then(function(data){ 
      return data.meetings; 
     }) 
    } 

    postMeeting(room: number, date: string, time: string){ 
     return this.http.post('/meetings', {"room": room, "date": date, "time": time}).then(function(data){ 
      return data.meeting; 
     }) 
    } 
} 

bootstrap(MeetingFormComponent); 

मैं इस त्रुटि मिलती है: यहाँ मेरी कोड है। क्या मुझे एक कदम याद आ रहा है? मैंने सर्विस क्लास को बूटस्ट्रैप करने का भी प्रयास किया है लेकिन यह काम नहीं करता है।

उत्तर

5

मार्क आपकी सेवा इस तरह इंजेक्शन के रूप में:

import {Injectable} from 'angular2/core'; 

@Injectable() 
class MeetingService { ... } 

आप के बारे में है कि HERE

अद्यतन में और अधिक पढ़ सकते हैं कि आपके कोड 1 फ़ाइल में सभी के रूप में आप इसे ऊपर से पता चला है, तो आपको घटक के ऊपर अपनी सेवा की परिभाषा को स्थानांतरित करने की आवश्यकता होगी, क्योंकि ES6 (ES2015) में कक्षाएं फंसे नहीं हैं क्योंकि कार्य ES5 में हैं।