ЕСЛИ ЕЩЕ условие в XML или Javascript - PullRequest
0 голосов
/ 21 июня 2019

У меня проблема с условием if else внутри списка в nativescript (js и xml).

В настоящее время я хочу сделать просмотр списка выделенным, когда фактическая дата уже позади плановой даты. другими словами, хотите указать просмотр списка как позднюю работу, чтобы люди знали об этом.

вся поздняя работа имеет значение 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 = 1 будет красного цвета. в то время как другие останутся нормальными.

1 Ответ

0 голосов
/ 21 июня 2019

Я создал для вас игровую площадку здесь .Вы можете проверить значение 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" },
],
...