Javascript 如何在 SAPUI5 XML-View 中使用 if-else 条件？
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/34653740/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
How to use an if-else condition in a SAPUI5 XML-View?
提问by Benvorth
How can I implement an if-else condition in a XML-View in SAPUI5 that uses a flag (condition) from a JSONModel?
如何在 SAPUI5 的 XML-View 中实现 if-else 条件，该条件使用来自 a 的标志（条件）JSONModel？
So far I have a Controller:
到目前为止，我有一个控制器：
sap.ui.define([
"sap/ui/core/mvc/Controller",
"sap/ui/model/json/JSONModel"
], function (Controller, JSONModel) {
"use strict";
return Controller.extend("sap.ui.demo.myApp.myController", {
onInit: function () {
//// set data model on view
var oData = {
title: "A cool title",
values: [{name: "Text 1", marketed: true}, {name: "Text 2", marketed: false}, {name: "Text 3", , marketed: true}]
};
var oModel = new JSONModel(oData);
this.getView().setModel(oModel);
}
});
});
and a View:
和一个视图：
<mvc:View
controllerName="sap.ui.demo.myApp.myController"
xmlns="sap.m">
<!-- using aggregation binding -->
<Panel expandable="true" expanded="true" headerText="{/title}" width="100%" content="{/values}">
<content>
<Label text="{name}"/>
<!-- if {marketed}
<Label text="product is marketed"/>
else
add nothing
-->
</content>
</Panel>
</mvc:View>
Edit:
编辑：
Is there a better way to do it than by implementing an overkill-feeling XML-Preprocessor?
有没有比实现过度杀伤的 XML 预处理器更好的方法呢？
回答by Marc
OpenUI5 supports Preprocessing Instructionsand Expression Binding.
With Preprocessing Instructionsyou can do stuff like this:
使用预处理指令，您可以执行以下操作：
<template:if test="{marketed}">
<template:then>
<Label text="product is marketed" />
</template:then>
<template:else>
<Image src="path.jpg" />
</template:else>
</template:if>
I am not sure if the testin the first line tests for null/not nullor true/false. This is where the Expression Bindingmight be handy: it allows for complex expressions within the curly brackets:
我不确定test第一行中是否测试null/not null或true/false。这就是表达式绑定可能很方便的地方：它允许大括号内的复杂表达式：
<template:if test="{= ${marketed} === true}">
Edit
编辑
The following solution might be more simple, but seems a little hacky.
以下解决方案可能更简单，但似乎有点笨拙。
Embed both elements in your XML view, but toggle the visibility with complex expression binding:
在您的 XML 视图中嵌入这两个元素，但使用复杂的表达式绑定切换可见性：
<Label text="product is marketed" visible="{= ${marketed} === true}"/>
<Image src="path.jpg" visible="{= ${marketed} === false}"/>
回答by user2808624
I am not sure I got your requirement, but it looks like simply binding the visible attribute to the marketed-flag would do.
我不确定我是否满足了您的要求，但看起来只需将可见属性绑定到市场标志就可以了。
If you need to bind in a negated way you can use expression binding like
如果您需要以否定方式绑定，您可以使用表达式绑定，如
visible="{= !${/marketed}}"
回答by JamieC
If I've understood your question propery, you could use a formatter function.
如果我已经理解了您的问题，您可以使用格式化程序功能。
<Label text="{
path: 'marketed'
formatter: '.formatter.marketed'
}"/>
.formatter.marketedin this example references a function in a separate formatter.js file:
.formatter.marketed在这个例子中，在一个单独的 formatter.js 文件中引用了一个函数：
marketed: function(marketed) {
if(marketed) {
return 'product is marketed';
} else {
return '';
}
}
See the ui5 SDK for hpow to set up the formatter function correctly:
看ui5 SDK for hpow正确设置formatter功能：
https://sapui5.hana.ondemand.com/sdk#docs/guide/0f8626ed7b7542ffaa44601828db20de.html
https://sapui5.hana.ondemand.com/sdk#docs/guide/0f8626ed7b7542ffaa44601828db20de.html
In your example, as this is just a label, we're returning an empty string, so it will just be blank. The Label will still be rendered, but it's an empty string, so there's nothing to show, so the user will never know it's there. I'm not entirely sure, but if you return undefinedinstead of an empty string, the label may not be rendered at all.
在您的示例中，由于这只是一个标签，我们将返回一个空字符串，因此它只是空白。Label 仍然会被渲染，但它是一个空字符串，所以没有什么可显示的，所以用户永远不会知道它在那里。我不完全确定，但如果您返回undefined而不是空字符串，则标签可能根本不会呈现。
