我对本机脚本(js和xml)的listview中的if else条件有疑问。
我当前要在实际日期晚于计划日期时使列表视图突出显示。换句话说,想要将listview指示为延迟工作,以便人们意识到这一点。
所有迟到的工作的值为1,我想用它来区分突出显示。
<lv:RadListView.listViewLayout>
<lv:ListViewLinearLayout scrollDirection="Vertical"/>
</lv:RadListView.listViewLayout>
<lv:RadListView.itemTemplate>
<StackLayout class="ListStackOuter" tap="onJobListTap">
<GridLayout class="ListGrid" columns="80, *, 30" rows="auto,auto" >
<Label id="lblJobId" class="ListLabelMediumBold" text="{{ job_id }}" row="0" col="0" textWrap="true" colSpan="2"/>
<Label id="lblNext" class="ListLabelNext" text=">" row="0" col="2"/>
<Label id="lblJobDesc" class="ListLabelSmall" text="{{ job_desc }}" row="1" col="0" colSpan="3"/>
<Label id="lblJobLate" class="ListLabelSmall" text="{{ late_job }}" row="1" col="2" colSpan="3"/>
</GridLayout>
</StackLayout>
</lv:RadListView.itemTemplate>
</lv:RadListView>
</ScrollView>
我希望Late_job status = 1的所有作业都是红色。而其他人将保持正常状态。
答案 0 :(得分:0)
我为您here创建了一个游乐场。您可以检查late_job的值,例如class="{{ (late_job === '1') ? 'list-group-item-heading' : ''}}"
您可以使用如下所示的三元运算符
<ListView class="list-group" items="{{ countries }}" itemTap="{{ onItemTap }}"
style="height:1250px">
<ListView.itemTemplate>
<FlexboxLayout flexDirection="row" class="list-group-item">
<Image src="{{ imageSrc }}" class="thumb img-circle" />
<Label text="{{ name }}" class="{{ (name === 'Australia') ? 'list-group-item-heading' : ''}}"
verticalAlignment="center" style="width: 60%" />
</FlexboxLayout>
</ListView.itemTemplate>
</ListView>
和.js
countries: [
{ name: "Australia", imageSrc: "https://play.nativescript.org/dist/assets/img/flags/au.png" },
{ name: "Belgium", imageSrc: "https://play.nativescript.org/dist/assets/img/flags/be.png" },
{ name: "Bulgaria", imageSrc: "https://play.nativescript.org/dist/assets/img/flags/bg.png" },
{ name: "Canada", imageSrc: "https://play.nativescript.org/dist/assets/img/flags/ca.png" },
{ name: "Switzerland", imageSrc: "https://play.nativescript.org/dist/assets/img/flags/ch.png" },
{ name: "China", imageSrc: "https://play.nativescript.org/dist/assets/img/flags/cn.png" },
],