Связывать данные на основе условий в представлениях XML. SAPUI5

1

У меня уже есть вкладка значков. Мне нужно отображать данные в одном из полей вкладок на основе условия. Например:

Для столбца ниже я должен отображать данные на основе условия.

if text.type ===1, 
     display text.field1 
else if text.type ===2,
     .... text.field2
else
     .... text.field3
endif.

Фрагмент кода:

<ColumnListItem type="Active">
<cells>
<Text text="{= ${/TxtModel/AssignType} === '1' ?  }" width="auto" maxLines="2" wrapping="false" textAlign="Center" textDirection="Inherit"/>

</ColumnListItem>
  • 0
    Так будет ли это работать? <Text text = "{= {$ {aufnrTxtModel> / Ltxt / AssignType} === '1'? $ {AufnrTxtModel> / Ltxt / Pernr}: ''} || = {$ {aufnrTxtModel> / Ltxt / AssignType} === '5'? $ {AufnrTxtModel> / Ltxt / Ingpr}: ''} || = {$ {aufnrTxtModel> / Ltxt / AssignType} === '8'? $ {AufnrTxtModel> / WCPL}: '' }} "width =" auto "maxLines =" 2 "wrapping =" false "textAlign =" Center "textDirection =" Inherit "/>
  • 0
    К сожалению нет. Я только добавил свой ответ ниже . Это должно помочь.
Теги:
sapui5

3 ответа

0
Лучший ответ

Связывание выражений содержит несколько синтаксических ошибок. Поскольку в любом случае он слишком длинный и неразборчивый, лучше используйте форматтер, как рекомендовано UI5:

Мы рекомендуем использовать функции форматирования вместо очень сложных и трудно читаемых выражений. [SRC]

В твоем случае:

<Text text="{
  path: 'aufnrTxtModel>/Ltxt/AssignType',
  formatter: '.getMyText'
}" />

Затем в контроллере:

getMyText: function(assignType) {
  const myModel = this.getView().getModel("aufnrTxtModel");
  switch (assignType) {
    case "1":
      return myModel.getProperty("/Ltxt/Pernr");
    case "5":
      return myModel.getProperty("/Ltxt/Ingpr");
    case "8":
      return myModel.getProperty("/WCPL");
    default:
      return assignType;
  }
},
Поделиться
0

Вы можете использовать вложенные выражения привязки:

<Input id='inputStatus3' enabled='false' value='{= ${/AssignType} === "1" ? "field1" : ${/AssignType} === "2" ? "field2" : ${/AssignType} === "3" ? "field3" : "field4" }' />


<!DOCTYPE html>
<html>
    <head>
        <meta charset='utf-8'>
        <title>Bernard LeTourneur - UI5 Single Page</title>
        <script
        	src='https://sapui5.hana.ondemand.com/resources/sap-ui-core.js'
            id='sap-ui-bootstrap'
            data-sap-ui-theme='sap_belize'
            data-sap-ui-libs='sap.m'
            data-sap-ui-bindingSyntax='complex'
            data-sap-ui-compatVersion='edge'
            data-sap-ui-preload='async'>    
        </script>
        <script id='myXmlView' type='ui5/xmlview'>
            <mvc:View
                controllerName='MyController'
                xmlns='sap.m'
                xmlns:core='sap.ui.core'
                xmlns:mvc='sap.ui.core.mvc'>
                <Input id='inputAssignType' valueLiveUpdate='true' enabled='true' value='{/AssignType}' />                
                <Input id='inputOutcome' enabled='false' value='{= ${/AssignType} === "1" ? "field1" : ${/AssignType} === "2" ? "field2" : ${/AssignType} === "3" ? "field3" : "default" }' />
            </mvc:View>
        </script>
        <script>
            sap.ui.getCore().attachInit(function () {
                'use strict';

                sap.ui.define([
                    'sap/ui/core/mvc/Controller',
                    "sap/ui/model/json/JSONModel"
                ], function (Controller, JSONModel) {
                    'use strict';

                    return Controller.extend('MyController', {
                        onInit : function () {                     
                            this.getView().setModel(new JSONModel({AssignType: '3'}));
                        },
                    });
                });
                sap.ui.xmlview({
                    viewContent : jQuery('#myXmlView').html()
                }).placeAt('content');
            });
        </script>
    </head>
    <body class='sapUiBody'>
        <div id='content'></div>
    </body>
</html>
Поделиться
0

Используйте инструкции по предварительной обработке

Я использую у вас 4 варианта использования на основе AssignType сотрудника 1 или 5 или 8. Здесь мы используем инструкцию if/then/else.

  <template:if test="{= {${aufnrTxtModel>/Ltxt/AssignType} === 1}">
      <template:then>
         <Text text="{aufnrTxtModel>/Ltxt/Pernr}" width="auto" maxLines="2" wrapping="false" textAlign="Center" textDirection="Inherit"/>
      </template:then>
      <template:elseif test="{= {${aufnrTxtModel>/Ltxt/AssignType} === 5}">
        <Text text="{aufnrTxtModel>/Ltxt/Ingpr}" width="auto" maxLines="2" wrapping="false" textAlign="Center" textDirection="Inherit"/>
      </template:elseif>
    <template:elseif test="{= {${aufnrTxtModel>/Ltxt/AssignType} === 8}">
        <Text text="{aufnrTxtModel>/WCPL}" width="auto" maxLines="2" wrapping="false" textAlign="Center" textDirection="Inherit"/>
      </template:elseif>
      <template:else>
        <Text text="" width="auto" maxLines="2" wrapping="false" textAlign="Center" textDirection="Inherit"/>
      </template:else>
    </template:if>

Вы также можете использовать пользовательский форматтер, где вы можете передавать AssignType, Pernr, Ingpr, WCPL в пути, и они будут доступны в вашей функции formatter, где вы можете написать всю свою логику, которая легче изменить, чем этот сложный xml.

Поделиться

Ещё вопросы

Сообщество Overcoder
Наверх
Меню