Question

我正在为项目使用nativescript-angular。 Here有一个缩放的实现。它使用本地引用（#item）和@ViewChild装饰来访问元素：

<GridLayout (pan)="onPan($event)" (pinch)="onPinch($event)" (doubleTap)="onDoubleTap($event)" class="page">
<StackLayout #item width="200" height="200" backgroundColor="Green">
    <Image src="res://icon" width="50" height="50" class="p-20"></Image>        
    <!-- all children ot the element #item will scale accordingly-->
</StackLayout>
<TextView #status row="1" editable="false"></TextView>

在组件中：

@ViewChild("item") angularItem: ElementRef;

工作正常。但我想在 ListView 中使用它。我的列表视图是这样的：

<ListView [items]="items" class="list-group">
    <ng-template let-item="item">
        <Label [text]="item.name" class="list-group-item"></Label>
    </ng-template>
</ListView>

如何为可以缩放每个元素的每个项目定义本地引用？

Answer 1

您可以使用args.object从传递给事件的参数中获取对象引用。

在您的情况下是这样的。

<ListView [items]="items" class="list-group">
    <ng-template let-item="item">
        <Label (pan)="onPan($event)" [text]="item.name" class="list-group-item"></Label>
    </ng-template>
</ListView>

，您可以使用$event.object

在onPan函数中获取Label参考。

onPan(args){
  let label=<Label>args.object;
}

每个项目在列表视图中的多个本地角度引用

1 个答案: