使用表格行中的函数在Angular 4

时间:2017-09-05 15:14:54

标签: angular

我有一个Object数组,我想在html页面中创建一个包含数组信息的表。我想在表格的单元格中使用一个函数(在这一刻我使用的是一个显示某些信息的简单函数)。但信息是重复的,这是一个问题。我需要搜索此问题的解决方案

代码Html:

<html>
  <body>
    <div class="body"></div>
    <div class="allinfopark">
      <table>
        <tr>
          <th>Nome</th>
          <th>Città</th>
          <th>indirizzo</th>
          <th>Posti Totali</th>
          <th></th>
        </tr>
        <ng-container *ngFor="let zona of zones;let i=index">
        <tr>
          <td>{{zona.nome}}</td>
          <td>{{info(zona)}}</td>
          <td>{{zona.indirizzo}}</td>
        </tr>
      </ng-container>
      </table>
    </div>
  </body>
</html>

Code Component.ts:

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

  idgestore:number;
  zones:Array<Zona>;

  constructor(private _activatedroute:ActivatedRoute,private _zonaservice:ZonaService) { }

  ngOnInit() {
    this.idgestore=this._activatedroute.snapshot.params['gestoreId'];
    this.getInfo(this.idgestore);
  }

  getInfo(idgestore:number){
    let zonaObs=this._zonaservice.getInfoParks(idgestore);
    zonaObs.subscribe(data=>{
      this.zones=data;
      console.log(this.zones);
    });

  }



  info(a:any){
    console.log(a);
  }


}

这是结果的屏幕: enter image description here

0 个答案:

没有答案