代码之家 › 专栏 › 技术社区 › Vahid Najafi

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

angular2-nativescript nativescript angular

Vahid Najafi · 技术社区 · 6 年前

我在用 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 [items]="items" class="list-group">
    <ng-template let-item="item">
        <Label [text]="item.name" class="list-group-item"></Label>
    </ng-template>
</ListView>

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

1 回复 | 直到 6 年前

bhavin jalodara 6 年前

您可以使用 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>

您可以在onpan函数中使用 $event.object

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

推荐文章

Royi Namir · Nativescript将元素移动50%,而不是100%?

7 年前

Yogendra · 存储库。无法在Windows 10中加载cfg[关闭]

7 年前

Stephen Alejandro Alcalde · 无法读取angular2 nativescript中未定义的属性getPackageManager

7 年前

wendt88 · Nativescript方形按钮不起作用

7 年前

haim · brew cask安装android sdk

7 年前

Ateik · Nativescript-在Android上返回TextField时保持键盘打开

7 年前

krv · nativescript“安装Android SDK平台25”失败

7 年前

DavidB · 在Nativescript中初始化Firebase组件时出错

7 年前

Wandrille · NativeScript Angular-点击时获取X和Y事件

7 年前

Stephen Alejandro Alcalde · 如何使用angular2 nativescript在listview中隐藏某些行项目

7 年前