样式拉动以刷新 Nativescript Angular

Question

我正在关注 Nativescript Angular Pull to Refresh Styling 演示 (Found here) 并且无法让 this.myListViewComponent 不是 undefined 因此此代码段永远不会被触发：

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 指示器的样式？

以下代码片段来自 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

样式拉动以刷新 Nativescript Angular

Styling Pull to Refresh Nativescript Angular

pull-to-refresh

nativescript

angular