对列表视图上的绑定元素的三元操作不起作用。
https://play.nativescript.org/?template=play-js&id=xMm9oJ&v=2
<FlexboxLayout flexDirection="row" class="list-group-item">
<Image src="{{ imageSrc }}" class="thumb img-circle" />
<Label text="{{ name = 'Spain' ? 'INDIA' : name }}" class="list-group-item-heading"
verticalAlignment="center" style="width: 60%" />
</FlexboxLayout>
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" },
{ name: "Czech Republic", imageSrc: "https://play.nativescript.org/dist/assets/img/flags/cz.png" },
{ name: "Germany", imageSrc: "https://play.nativescript.org/dist/assets/img/flags/de.png" },
{ name: "Spain", imageSrc: "https://play.nativescript.org/dist/assets/img/flags/es.png" },
{ name: "Ethiopia", imageSrc: "https://play.nativescript.org/dist/assets/img/flags/et.png" },
{ name: "Croatia", imageSrc: "https://play.nativescript.org/dist/assets/img/flags/hr.png" },
{ name: "Hungary", imageSrc: "https://play.nativescript.org/dist/assets/img/flags/hu.png" },
{ name: "Italy", imageSrc: "https://play.nativescript.org/dist/assets/img/flags/it.png" },
{ name: "Jamaica", imageSrc: "https://play.nativescript.org/dist/assets/img/flags/jm.png" },
{ name: "Romania", imageSrc: "https://play.nativescript.org/dist/assets/img/flags/ro.png" },
{ name: "Russia", imageSrc: "https://play.nativescript.org/dist/assets/img/flags/ru.png" },
{ name: "United States", imageSrc: "https://play.nativescript.org/dist/assets/img/flags/us.png" },
],
我尝试向印度展示而不是向西班牙展示,但我没有成功。如果不可能,那么如何实现呢?
答案 0 :(得分:1)
请确保为您的操作员添加额外的=
。看起来您实际上是在将INDIA分配为您在那里拥有的每个name属性的名称
<FlexboxLayout flexDirection="row" class="list-group-item">
<Image src="{{ imageSrc }}" class="thumb img-circle" />
<Label text="{{ name === 'Spain' ? 'INDIA' : name }}" class="list-group-item-heading"
verticalAlignment="center" style="width: 60%" />
</FlexboxLayout>
答案 1 :(得分:1)
您还可以避免使用花括号并使用绑定语法。很干净。
<FlexboxLayout flexDirection="row" class="list-group-item">
<Image [src]="imageSrc" class="thumb img-circle" />
<Label [text]="name === 'Spain' ? 'INDIA' : name" class="list-group-item-heading"
verticalAlignment="center" style="width: 60%" />
</FlexboxLayout>
答案 2 :(得分:0)
三元运算将根据条件起作用。如果结果是true或false,那么它将正常工作。因此,在编写条件语句时必须非常小心。因为在代码中不是==而是写为=。这就是它无法正常工作的原因。