深入介绍 UI5 框架里 Smart Field 控件的工作原理

<template:elseif test="{= (${dataField>RecordType} === 'com..vocabularies.UI.v1.DataFieldWithNavigationPath')}">
      <!-- ObjectPage Self-Linking -->
      <smartField:SmartField
        value="{path: 'dataField>Value', formatter: '.suite.ui.generic.template.js.AnnotationHelper.getDataFieldValueSimplePath'}"
        editable="{ui>/editable}" press="._templateEventHandlers.onDataFieldWithNavigationPath"
        ariaLabelledBy="{columnId>id}">
        <smartField:customData>
          <core:CustomData key="Target" value="{dataField>Target/NavigationPropertyPath}" />
        </smartField:customData>
        <smartField:configuration>
          <smartField:Configuration
            displayBehaviour="{parts: [{path: 'dataField>'}, {value: ''}, {path: 'listEntitySet>'}], formatter: '.suite.ui.generic.template.js.AnnotationHelper.getTextArrangementForSmartControl'}" />
        </smartField:configuration>
      </smartField:SmartField>
    </template:elseif>
    <template:elseif test="{= (${dataField>RecordType} === 'com..vocabularies.UI.v1.DataFieldForAction' || ${dataField>RecordType} === 'com..vocabularies.UI.v1.DataFieldForIntentBasedNavigation') &amp;&amp; ${dataField>Inline/Bool} === 'true'}">
      <!-- handle inline actions -->
      <core:Fragment fragmentName=".suite.ui.generic.template.fragments.InlineButton" type="XML"/>
    </template:elseif>
    <template:elseif test="{= (${dataField>RecordType} === 'com..vocabularies.UI.v1.DataFieldWithIntentBasedNavigation')}">
      <!--handle DataFieldWithIntentBasedNavigation -->
      <fe:Link
        text="{parts: [{path: 'dataField>'}, {path: 'listEntitySet>'}], formatter: 'AH.getLinkTextForDFwithIBN'}"
        press="._templateEventHandlers.onDataFieldWithIntentBasedNavigation" wrapping="true">
        <fe:customData>
          <core:CustomData key="SemanticObject" value="{path: 'dataField>SemanticObject', formatter: '.ui.model.odata.AnnotationHelper.format'}"/>
          <core:CustomData key="Action" value="{path: 'dataField>Action', formatter: '.ui.model.odata.AnnotationHelper.format'}"/>
        </fe:customData>
      </fe:Link>
    </template:elseif>

<mvc:View
  xmlns:mvc=".ui.core.mvc"
  controllerName=".ui.demo.smartControls.SmartField"
  xmlns:form=".ui.layout.form"
  xmlns=".m"
  xmlns:smartField=".ui.comp.smartfield">
  <form:SimpleForm 
    minWidth="1024"
    maxContainerCols="2"
    editable="true"
    layout="ResponsiveGridLayout"
    labelSpanL="3"
    labelSpanM="3"
    emptySpanL="4"
    emptySpanM="4"
    columnsL="1"
    columnsM="1"
    class="editableForm">
    <form:content>
      <smartField:SmartLabel labelFor="idPrice"/>
      <smartField:SmartField value="{Price}" id="idPrice"/>
      <Button
        text="Print"
        press="onPrintTriggered"/>
    </form:content>
  </form:SimpleForm>
</mvc:View>

<?xml version="1.0" encoding="utf-8"?>
<edmx:Edmx Version="1.0"
       xmlns:edmx="http://schemas.microsoft.com/ado/2007/06/edmx"
       xmlns:m="http://schemas.microsoft.com/ado/2007/08/dataservices/metadata"
       xmlns:="http://www..com/Protocols/Data">
  <edmx:DataServices m:DataServiceVersion="2.0">
    <Schema Namespace="com..wt01"
        :schema-version="1" xmlns="http://schemas.microsoft.com/ado/2008/09/edm">
      <EntityType Name="Product">
        <Key>
          <PropertyRef Name="ProductId"/>
        </Key>
        <Property Name="ProductId" Type="Edm.String"/>
        <Property Name="Price" Type="Edm.Decimal"
              :unit="CurrencyCode" :label="Jerry的价格"
              :updatable="true"/>
        <Property Name="CurrencyCode" Type="Edm.String"
              MaxLength="3" :label="Currency" :semantics="currency-code"
              :updatable="true"/>
      </EntityType>
      
      <EntityContainer m:IsDefaultEntityContainer="true"
               :supported-formats="atom json">
        <EntitySet Name="Products" EntityType="com..wt01.Product"
               :updatable="true"/>
      </EntityContainer>
    </Schema>
  </edmx:DataServices>
</edmx:Edmx>