2016-12-28 61 views
3

我做了一個組件與simle服務。 我想實現以下行爲 - 當我的服務的http.get請求完成時 - 使用接收到的參數進行另一個獲取請求。這與角2

但是,Groupservice請求的參數this.sections[0].Id未定義,並且當前沒有section參數。儘管從data.json收到的數據是正確的。

的代碼是(所附進口)

@Component({ 
    template: require('./content.component.html'), 
    styles: [require('./content.component.css')], 
    providers: [SectionService, GroupService] 
}) 
export class ContentComponent { 
    id: string; 
    sections: Array<Section>; 
    groups: Array<Group> 
    selectedSectionTitle: ""; 
    constructor(private router: Router, private activateRoute: ActivatedRoute, private sectionService: SectionService, private groupService: GroupService) { 
     this.router.events.subscribe(path => { 
      this.id = activateRoute.snapshot.params['id']; 
     }); 
     this.id = activateRoute.snapshot.params['id']; 

    } 


    ngOnInit() { 
     this.sectionService.getSections() 
      .subscribe((data: Response) => { 
       this.sections = data.json();   
      }, err => { 
       console.error("Error occurred while saving setting", err); 
      },() => { 
       this.groupService.getGroups(this.sections[0].Id).subscribe((data: Response) => { 
        this.groups = data.json(); 
       }) 
      }); 

    } 

} 

export class Group { 
    isSelectionComponentOpened: boolean; 
    isItemEditComponentOpened: boolean; 
    Id: string; 
    Title: string; 
    SectionId: string; 
    Items: Array<string> 
} 

export class Section { 
    Id: string; 
    Title: string; 

} 




@Injectable() 
export class SectionService { 


    constructor(private http: Http) { } 
    // Переделать на Observable 
    getSections() { 
     return this.http.get('Section/Get'); 
    } 
} 

我不能找出這個問題的原因。 請指教。

+0

這是角2,我很抱歉。 – Greenmachine

回答

1

ngOnInit

@Component({ 
    template: require('./content.component.html'), 
    styles: [require('./content.component.css')], 

}) 
export class ContentComponent { 
    id: string; 
    sections: Array<Section>; 
    groups: Array<Group> 
    selectedSectionTitle: ""; 
    constructor(private router: Router, private activateRoute: ActivatedRoute, private sectionService: SectionService, private groupService: GroupService) { 
     this.router.events.subscribe(path => { 
      this.id = activateRoute.snapshot.params['id']; 
     }); 
     this.id = activateRoute.snapshot.params['id']; 

    } 


    ngOnInit() { 
     let _self = this; 
     this.sectionService.getSections() 
      .subscribe((data: Response) => { 
       _self.sections = data.json();   
      }, err => { 
       console.error("Error occurred while saving setting", err); 
      },() => { 
       this.groupService.getGroups(_self.sections[0].Id).subscribe((data: Response) => { 
        _self.groups = data.json(); 
       }) 
      }); 

    } 

} 

export class Group { 
    isSelectionComponentOpened: boolean; 
    isItemEditComponentOpened: boolean; 
    Id: string; 
    Title: string; 
    SectionId: string; 
    Items: Array<string> 
} 

export class Section { 
    Id: string; 
    Title: string; 

} 




@Injectable() 
export class SectionService { 


    constructor(private http: Http) { } 
    // Переделать на Observable 
    getSections() { 
     return this.http.get('Section/Get'); 
    } 
} 

在module.ts這將避免使服務

+0

它會將'this'的值保存在變量'_self'中,這將有助於不超出範圍 – anshuVersatile

+0

OP已經使用胖箭頭語法。問題不在範圍內,而是關於異步操作 – echonax

+0

還在module.ts中添加'providers:[SectionService,GroupService]',這將避免生成服務的實例 – anshuVersatile

0

的情況下,這是我所遇到的最奇怪的事情添加providers: [SectionService, GroupService]使用let _self = this;。 但將部分Id屬性更改爲小寫幫助...

我沒有對此修復程序的解釋。