ngOnOnitの変数をAngular2に更新する

Question

最近Angular2の概念を学び始めたので、トランザクションを完了した後でngOnOnitのboolean 'loading'値を変更する方法を理解する上で問題があります。完全にサービス。誰かが私に手を差し伸べることができれば、それはすばらしいことだ。

基本的には、値の読み込みを「false」に変更し、サイクルを完了した後に「md-progress-circle」を非表示にします。

これは私のhtmlです。

<span *ngIf="loading"> 
<md-progress-circle mode="indeterminate"></md-progress-circle> 
</span> 

これは私のコンポーネントクラスです。

    import { Component, OnInit } from '@angular/core'; 
    import { Router } from '@angular/router'; 
    import { DemographicsService } from './app.service-http'; 
    import { Demographics } from './demographics'; 

    @Component({ 
     selector: 'app-data', 
     templateUrl: 'app/app.data.html', 
     styleUrls: ['app/app.data.css'] 
    }) 
    export class AppData implements OnInit { 

     demographics: Demographics[] = []; 
     loading: boolean = false; 

     constructor(
     private router: Router, 
     private demographicsService: DemographicsService) { 
     } 

     ngOnInit(): void { 
     this.loading = true; 
     this.demographicsService.getDemographics() 
      .then(demographics => this.demographics = demographics); 
     } 
    } 

.then

this.loader = false

Answer 1

内部.thenの最初の引数は、結果が到着したら、実行機能でこのようなものを追加します。

this.demographicsService.getDemographics().then(
    demographics => { 
     this.demographics = demographics; 
     this.loading = false; 
    } 
); 

一つのことをするために外を見るために：ちょうどあなたがやりたいようにコードの別の行を追加します。約束は拒否されるか、例外が発生した場合、loading=false行が実行されることはありませんし、アプリがに残る場合無限のローディング状態。

これに対処するには、代わりに.finallyブロックに読み込みを設定することができます。このブロックは何があっても実行されます：