IT干货网

UI5-文档-4.22-Expression Binding

flyfish 2022年03月09日 SAP 144 0

有时预定义的SAPUI5类型不够灵活,您希望在视图中执行简单的计算或格式化——这正是表达式真正有用的地方。我们使用它们根据数据模型中的当前数字格式化价格。

Preview

 

The price is now formatted according to its number

Coding

You can view and download all files at Walkthrough - Step 22.

 

webapp/view/InvoiceList.view.xml

<mvc:View 
controllerName="sap.ui.demo.walkthrough.controller.InvoiceList" 
xmlns="sap.m" 
   xmlns:mvc="sap.ui.core.mvc"> 
   <List 
      headerText="{i18n>invoiceListTitle}" 
      class="sapUiResponsiveMargin" 
      width="auto" 
      items="{invoice>/Invoices}" > 
      <items> 
         <ObjectListItem 
            title="{invoice>Quantity} x {invoice>ProductName}" 
            number="{ 
               parts: [{path: 'invoice>ExtendedPrice'}, {path: 'view>/currency'}], 
               type: 'sap.ui.model.type.Currency', 
               formatOptions: { 
                       showMeasure: false 
               } 
               }" 
               numberUnit="{view>/currency}" 
          numberState="{= ${invoice>ExtendedPrice} > 50 ? 'Error' : 'Success' }"/> 
      </items> 
   </List> 
</mvc:View>

操作符的条件是来自我们的数据模型的值。表达式绑定中的模型绑定必须使用$符号转义,正如您在代码中看到的那样。如果价格高于50,我们将状态设置为“Error”(数字将显示为红色),否则设置为“Success”(数字将显示为绿色)。我们在声明性视图中添加了属性numberState,并引入了一个新的绑定语法,该语法从括号中的=开始。这个符号用于初始化新的绑定语法,它被称为表达式,可以执行简单的计算逻辑,如这里所示的三元运算符。

表达式仅限于帮助格式化数据(如数学表达式、比较等)的一组特定操作。您可以在文档中查找可能的操作。

Conventions

  只对简单的计算使用表达式绑定。

Parent topic: Walkthrough

Previous: Step 21: Data Types

Next: Step 23: Custom Formatters

Related Information

Expression Binding


评论关闭
IT干货网

微信公众号号:IT虾米 (左侧二维码扫一扫)欢迎添加!

UI5-文档-4.21-Data Types