角度2のデータがバインドされていない<table>

Question

シンプルなJSONデータを<table>にバインドしようとしていました。しかし、私のHTMLページは空のデータを表示していますが、行数はデータごとに表示されています。各<tr>内のデータは空です。私のコードに何が間違っているのか分かりません。

ここで何か間違っていると誰かが私を助けることができますか？

Pay.Component.ts

@Component({ 
moduleId: module.id,  
templateUrl: './pay.component.html' 
}) 

export class PayComponent {  

myData: any[] = [ 
    { 
     "Col1": "120f2dcf-d4a4-4b3c-994a-e4e0c79bd642", 
     "Col2": "2017-03-27T00:00:00-07:00", 
     "Col3": "Testing1"    
    }, 
    { 
     "Col1": "320f2dcf-d4a4-4b3c-994a-e4e0c79bd642", 
     "Col2": "2018-03-27T00:00:00-07:00", 
     "Col3": "Testing2"    
    }] 
} 

pay.component.html

<div class="content table-responsive table-full-width"> 
        <table class="table table-hover table-striped"> 
         <thead> 
          <tr> 
           <th>Col1</th> 
           <th>Col2</th> 
           <th>Col3</th> 
          </tr> 
         </thead> 
         <tbody> 
          <tr *ngFor='let pay of myData'> 
           <td>{{ pay.col1 }}</td> 
           <td>{{ pay.col2 }}</td> 
           <td>{{ pay.col3 }}</td> 
          </tr> 
         </tbody> 
        </table> 
       </div> 

ないコードと間違って何が起こっているか確認してください。

Answer 1

悪いです。データがテーブルにバインドされていたときに小文字を使用していたため、問題が見つかりました。

大文字に変更した後の問題を修正しました。{{pay.Col1}}