如何在角度4中直接在模板绑定中增加变量?

时间:2017-08-01 13:50:07

标签: angular typescript local-variables angular-template

我有以下对象:

  this.people = [{
        name: 'Douglas  Pace',
        title: 'Parcelivery Nailed The Efficiency',
        content: 'Since I installed this app, its always help me book every tickets I need like flight, concert, ' +
          'movie or hotel. I don\'t need to install different app for different ticket. The payment is also very easy',
        image: '../../assets/img/profile_pics/profile_pic.jpg',
        rate: '4.5',
        classActive: 'testimonials__selected-visible',
        active: true
      },
      {
        name: 'Naseebullah  Ahmadi',
        title: 'Parcelivery Nailed The Efficiency',
        content: 'Since I installed this app, its always help me book every tickets I need like flight, concert, ' +
          'movie or hotel. I don\'t need to install different app for different ticket. The payment is also very easy',
        image: '../../assets/img/profile_pics/profile_pic.jpg',
        rate: '4.5',
        classActive: '',
        active: false
      },
      {
        name: 'Haseebullah Ahmadi',
        title: 'Parcelivery Nailed The Efficiency',
        content: 'Since I installed this app, its always help me book every tickets I need like flight, concert, ' +
          'movie or hotel. I don\'t need to install different app for different ticket. The payment is also very easy',
        image: '../../assets/img/profile_pics/profile_pic.jpg',
        rate: '4.5',
        classActive: '',
        active: false
      }
    ];

我正在循环使用html,如下所示:

  <ng-template ngFor let-person="$implicit" let-variable [ngForOf]="people">
          {{variable + 30}}
   <ng-template/>

我的问题是,是否有一种方法可以为模板绑定中的ngfor中的每个元素设置局部变量并将其递增30?而不是有方法来进行递增?

我从方法中增加变量的问题是我得到以下错误:

  

错误:ExpressionChangedAfterItHasBeenCheckedError:Expression有   在检查后发生了变化

1 个答案:

答案 0 :(得分:3)

<ng-template ngFor let-person="$implicit" let-variable [ngForOf]="people" let-i="index">
  <p *ngIf="i == 0">{{variable + 30}}</p>
  <p *ngIf="i > 0">{{variable + (30*i)}}</p>
<ng-template/>

通过此,您可以获得从0到总长度的索引。