ListView*ngFor的istead

我在NativeScript中使用滚动视图查看聊天概述

到目前为止，我在Scrollview中使用了以下代码：

<ScrollView #scrollLayout style="height: 80%;margin-top: -200px">

   <StackLayout class="chat-body">
        <StackLayout *ngFor="let message of messages"  orientation="vertical">

                <Label *ngIf="message.sender == me" horizontalAlignment="right" class="chat-message-me" [text]="message.msg"></Label>
                <Label *ngIf="message.sender == me" horizontalAlignment="right" class="chat-timestamp" [text]="message.time"></Label>
            
                <Label *ngIf="message.sender != me" horizontalAlignment="left" class="chat-message-you" [text]="message.msg"></Label>
                <Label *ngIf="message.sender != me" horizontalAlignment="left" class="chat-timestamp" [text]="message.time"></Label>
        
        </StackLayout> 
    </StackLayout>

</ScrollView>

---

ListView

会自动滚动，因此您不需要

ScrollView

父视图

您看到的错误是因为

列表视图

需要一个组件/布局（其中有4个标签）

要修复此错误，您可以将标签包装在

ContentView

或类似的布局中：

---

但是，在

列表视图中使用
ngIf
s会对性能产生一些影响。如果可能，请改用多个项目模板。这对两种方法进行了深入的比较。
A
ListView
会自动滚动，因此您不需要
ScrollView
父级

您看到的错误是因为
列表视图
需要一个组件/布局（其中有4个标签）

要修复此错误，您可以将标签包装在
ContentView
或类似的布局中：



但是，在
列表视图中使用
ngIf
s会对性能产生一些影响。如果可能，请改用多个项目模板。这对这两种方法进行了深入的比较。
非常感谢您的回答，但如果我这样做，标签将无法识别姓名和发件人。此错误：“TypeError:无法读取未定义的属性'name'”和“TypeError:无法读取未定义的属性'sender'”，感谢您的性能提示！！！我认为未定义的错误是因为
let item
。尝试将其更改为
let message=“item”
@非常感谢您的回答，但如果我这样做，标签就无法识别姓名和发件人。此错误：“TypeError:无法读取未定义的属性'name'”和“TypeError:无法读取未定义的属性'sender'”，感谢您的性能提示！！！我认为未定义的错误是因为
let item
。尝试将其更改为
let message=“item”
@交换
<ScrollView #scrollLayout style="height: 80%;margin-top: -200px">
    <GridLayout class="chat-body">
        <ListView [items]="messages" orientation="vertical">
            <ng-template let-item="message">
                
                <Label *ngIf="message.sender == me" horizontalAlignment="right" class="chat-message-me" [text]="message.msg"></Label>
                <Label *ngIf="message.sender == me" horizontalAlignment="right" class="chat-timestamp" [text]="message.time"></Label>
            
                <Label *ngIf="message.sender != me" horizontalAlignment="left" class="chat-message-you" [text]="message.msg"></Label>
                <Label *ngIf="message.sender != me" horizontalAlignment="left" class="chat-timestamp" [text]="message.time"></Label>

                
            </ng-template>
        </ListView>
   </GridLayout>
</ScrollView>

System.err: An uncaught Exception occurred on "main" thread.
System.err: Calling js method getView failed
System.err: Error: No suitable views found in list template! Nesting level: 0
System.err: