Angular 2与*ngFor和ngIf隐藏第一个元素

Question

在Angular 2中,我得到了一个项目列表,并根据给定的条件(即基于位置编号)我设置列表重复.

我需要为每个位置的第一个框隐藏" 删除文本 ".

Plunker: https://plnkr.co/edit/xtX5BjTBjO61sD2tLwWN ？p = preview:

[1]: https://plnkr.co/edit/xtX5BjTBjO61sD2tLwWN?p=preview

import {Component} from '@angular/core';

@Component({
	selector: 'app',
	template: `
	  
    <ul *ngFor="let locdata of locations">
   
     <template ngFor let-item [ngForOf]="items"; let-i=index>
          <div *ngIf="item.location==locdata.location">
             <div class="title"> location  {{ item.location}} <span  *ngIf="isNotFirst(item)">  remove </span> </div>
          <div class="container"> {{ item.sedule}}</div>
       </div>
      </template>
	  </ul>
	 
	`
})
export class App {
  items: string[];
  
   isNotFirst(item: any) {
      return this.items.filter(i => i.location === item.location).map(i => i.id).indexOf(item.id) !== 0;
    }
  
  locations:any;
  
  constructor() {
    this.locations=[{location:1},{location:2},{location:3}]; 
    
    this.items = [{
    id:1,
    location:1,
    sedule:1
  },
  {
    id:2,
    location:2,
    sedule:1
  },
  {
    id:3,
    location:1,
    sedule:2
  },
  {
    id:4,
    location:2,
    sedule:2
  },
  {
    id:5,
    location:1,
    sedule:2
  },
  {
    id:6,
    location:2,
    sedule:3
  },  {
    id:7,
    location:3,
    sedule:1
  },
  {
    id:8,
    location:3,
    sedule:2
  },
  {
    id:9,
    location:3,
    sedule:3
  }];
  }
  
}

Answer 1

假设你有一个<span>在*ngFor逻辑,你可以使用first从*ngFor和显示/隐藏<span>通过*ngIf

<div *ngFor="let item in data; let first=first;">
  {{item.attr}}
  <span *ngIf="!first">
    remove
  </span>
</div>

你的工作人员.