样式拉动以刷新 Nativescript Angular

Question

我正在关注 Nativescript Angular Pull to Refresh Styling 演示 (Found here)，但无法让 this.myListViewComponent 成为 undefined，因此这个 sn-p 永远不会被触发：

if (this.myListViewComponent && this.myListViewComponent.listView) {
  let style = new PullToRefreshStyle();
  style.indicatorColor = new Color("red");
  style.indicatorBackgroundColor = new Color("blue");
  this.myListViewComponent.listView.pullToRefreshStyle = style;
}

这里唯一的区别是它是主页的一部分，正在延迟加载（我不确定这是否重要）。

还有其他方式来设置 PullToRefresh 指示器的样式吗？

以下 sn-p 来自 Nativescript Core 文档，因此不适用于 Angular：

<lv:RadListView.pullToRefreshStyle>
    <lv:PullToRefreshStyle
        indicatorColor="white" 
        indicatorBackgroundColor="blue"/>
</lv:RadListView.pullToRefreshStyle>

显然，以下示例不适用于 Angular 代码。还有另一种我想念的方式，就像这个完全假的伪代码：

<RadListView>
    <ng-template>...</ng-template>
    <PullToRefreshStyle
        indicatorColor="white" 
        indicatorBackgroundColor="blue">
    </PullToRefreshStyle>
</RadListView>

我使用的是 Nativescript 6+。

Answer 1

loaded 事件的处理方式与您可能在 Angular 中使用的任何其他事件一样。

HTML

<RadListView class="list-group" pullToRefresh="true" [items]="countries"
    (itemTap)="onItemTap($event)" (loaded)="onLoaded($event)">
    ....
</RadListView>

TS

onLoaded(event: EventData) {
    let style = new PullToRefreshStyle();
    style.indicatorColor = new Color("red");
    style.indicatorBackgroundColor = new Color("blue");
    (<RadListView>event.object).pullToRefreshStyle = style;
}

Playground Sample