2017-04-13 16 views
1

私はAPI呼び出しを介してユーザーを取得するプロファイルコンポーネントを持っています。ユーザーはリフレッシュ時に入力バインディング経由で利用できませんAngular4

ProfileComponent

this.UserSubscription = this.auth.getUser().subscribe(res => { 
this.User = res; 
}) 

と私はコンソールをリロードするには、子

<section class="user-achievements" *ngIf="User"> 
    <achievements [User]="User"></achievements> 
</section> 

AchievementsComponent

@Component({ 
    selector: 'achievements', 
    template: ` 
     <ng-container *ngIf="User"> 
     <div *ngFor="let achievement of Achievements"> 
      <h5>Achievment</h5> 
      <div>Name:</div> 
      <div>Progress:</div> 
     </div> 
     </ng-container>`, 
    styleUrls: ['./achievements.component.scss'] 
}) 
export class AchievementsComponent implements OnInit { 
    @Input() User; 
    Achievements; 
    constructor(
    private api: ApiClient, 
) {} 
    ngOnInit() { 
    console.log('this user', this.User); 
    this.api.get(`users/${this.User.id}/achievements`) 
     .subscribe(res => { 
     this.Achievements = res.content; 
     }); 
    } 

    } 

にユーザーデータを渡すには、私のAPIコールワットを示していますiはユーザーとして未定義です。 子コンポーネントにデータをロードする正しい方法は何ですか?

答えて

0

ユーザーにタイプを指定します。

いくつかの便利なコード

@Input() user:string; 
@Input() user:any; 
@Inpuy() user: UserType 

class UserType { 
id:number 
name:string; 
} 

constructor(user:UserType) { 
this.user = user; 
} 
1

彼の問題は、Userだった彼の状態は偽陽性を投げていたので、空の目的でした。

+0

私のすぐ隣に座ってくれてありがとう。 – Jason

関連する問題