サーバーからのヌル応答の処理

Question

応答データを確認するための条件があります。私はデータがないときにはヌル応答を得ています。ヌルであれば "No data Found"と表示したい。私は試しましたngIf="!addresses"しかし、これはどのように私はこれを処理するのですか？ テンプレート：

<div class="col-md-9 col-sm-9 col-xs-9 *ngIf="(!addresses)"> 

       <div class="col-md-9 col-sm-9 col-xs-9"> 
       No Data Found 

      </div> 
      </div> 

コンポーネント：

getData(id){ 

     this.service.GetData(id) 
     .subscribe(addresses => this.addresses = addresses) 
     this.OnceHttp = !this.OnceHttp; 
     } 

応答： Null サービス：

GetData(id){ 
       const eurl='http://localhost/Angular/GetData.php?id=' 
       const url= `${eurl}${id}` 
       return this.http.get(url) 
       .map(this.extractData) 
       .catch(this.HandleError) 

      } 

私は、サーバーからNULL値を取得しています。誰かが私に何が間違っているか教えてもらえますか？

Answer 1

更新：次のように

あなたのコンポーネントでemptyプロパティを定義することができます。

getAddress(id){ 
    this.dataservice.Getaddress(id) 
    .subscribe(addresses => this.addresses = addresses); 
    this.OnceHttp = !this.OnceHttp; 
    } 

get empty(){ 
    return this.addresses === null || this.addresses.length === 0; 
} 

次に、あなたは

<div *ngIf="empty">//code to show when addresses has no content</div> 

Answer 2

として、あなたのテンプレートで取得するプロパティを使用することができますからhiddenを削除しますあなたの一番外側のdiv：

<div class="col-md-9 col-sm-9 col-xs-9 hidden margin-top" id="blank-skills" 
    *ngIf="!addresses"> 

私もヌルチェックとアドレス== nullかの代わりの!addressesチェックを行うだろうが、それはちょうど私の意見:)

hiddenなしで、それが動作するはずです：http://plnkr.co/edit/3bKTBjkiQHdBZmnqyhRi?p=preview