Angular 加载ngFor中的最后一项后调用指令

我有一个包含表的组件，我在tBody内的一行上调用ngFor，问题是我需要在加载ngFor的最后一个元素后运行我在表上应用的指令

这是我的组件

import {Component} from 'angular2/core';
import {InfScrollTableService} from './inf-scroll-table.service'
import {HTTP_PROVIDERS} from 'angular2/http';
import {InfScrollTableDirective} from './inf-scroll-table.directive'
@Component({
  selector: 'my-app',
  template: `
   <table class="scrollable" infScrollTable>
     <thead>
       <tr>
         <th class="small-cell">Code</th>
         <th>Label</th>
         <th>Area</th>
       </tr>
     </thead>
     <tbody>
       <tr  *ngFor="#country of countries; #last=last" *ngIf="last">
         <td class="small-cell">{{country.id}}</td>
         <td><a href="#" >{{country.id}}</a></td>
         <td>{{last}}</td>
       </tr>
     </tbody>
   </table>
`,
providers: [InfScrollTableService, HTTP_PROVIDERS],
directives: [InfScrollTableDirective]
})

export class AppComponent {
  public countries;
  constructor(private _infScrollTableService: InfScrollTableService){
    this._infScrollTableService.getCountries()
    .subscribe(
      data => {
        console.log(data);
        this.countries=data;
      });
  }
}

---

一种方法是对所有行应用一个指令并传递

last

。如果

last

为true，则指令实际上会执行某些操作

@Directive({selector: '[isLast]'})
export class LastDirective{
   @Input() isLast:boolean;
   @Output() lastDone:EventEmitter<boolean> = new EventEmitter<boolean>();
   ngOnInit() {
     if(this.isLast) {
       this.lastDone.emit(true);
     }
   }
}

@指令（{selector:'[isLast]}）
导出类指令{
@Input（）isLast：布尔值；
@Output（）lastDone:EventEmitter=neweventemitter（）；
恩戈尼尼特（）{
if（this.isLast）{
this.lastDone.emit（true）；
}
}
}

---

您还可以创建一个自定义的

ngFor

，提供附加功能。

如何处理导致重新渲染的数据更改？当前，即使当您只在中间插入或删除时，也会发生这种情况（我猜这将在将来被优化）如果您将一个项目追加到<代码>国家> /代码>，那么它不能绑定到“ISBASE”，因为它不是一个已知的本地属性，您需要对该元素应用一个指令或CONSONT，该元素具有<代码> @ INPUTE（）IsError；代码>以便

[isLast]=“last”

工作。例如，这个wozld需要在使用上述指令的

@Component（）

装饰程序中使用

指令：[LastDirective]

。已经导入了该指令并包含在指令：[]中，我刚刚将@directive（{selector:'isLast'}）更改为@directive（{selector:'[isLast]}），并且成功了。我不知道这是否与新版本的更改有关。我用的是RC2，我点击一个按钮就可以重新填充国家，我的（lastDone）发射了两次。你知道吗？

$scope.$on('LastElem', function(){...})

@Directive({selector: '[isLast]'})
export class LastDirective{
   @Input() isLast:boolean;
   @Output() lastDone:EventEmitter<boolean> = new EventEmitter<boolean>();
   ngOnInit() {
     if(this.isLast) {
       this.lastDone.emit(true);
     }
   }
}

<tr  *ngFor="let country of countries; let last=last" [isLast]="last" (lastDone)="doSomething()">