如何从其他控制器使用格式化程序？

Question

<m:Text  text="{    parts: [ {path:'myModel>firstText'}, {path:'myModel>/number'}  ],formatter:'.NumberFormatter'  }" />

我在与控制器绑定的xml视图中具有此格式化程序。它工作正常，一切都很好。

如何在ANOTHER xml视图中引用和使用此格式化程序？保持干燥。

Answer 1

通常格式化程序位于其自己的JS文件中

您的项目结构：

- webapp
|-- controller
  |-- First.controller.js
  |-- Second.controller.js
|-- util
  |-- Formatter.js
|-- view
  |-- First.view.xml
  |-- Second.view.xml
|-- Component.js
|-- index.html

您的Formatter.js可能看起来像这样

sap.ui.define([], function () {
    "use strict";
    return {
        NumberFormatter: function (sText, iNumber) {
            ...
        },
        MyOtherFormatter: function(...) {
            ...
        }
    };
});

现在每个控制器都必须引用格式化程序以使其在您的视图中可用。

sap.ui.define([
    "sap/ui/core/mvc/Controller",
    "../util/Formatter"
], function (Controller, Formatter) {
    "use strict";
    return Controller.extend("demo.controller.First", {

        formatter: Formatter, // < Important

        onInit : function () {
            ...
        }
    });
});

最后您可以在视图中使用它

<m:Text text="{
        parts: [ 
            'myModel>firstText',
            'myModel>/number'
        ],
        formatter: '.formatter.NumberFormatter'
    }" />

---

请参阅强烈推荐的官方演练的Step 23，它回答了所有初学者问题的95％！

Answer 2

1. 将格式化程序作为纯^_?静态功能模块：

   sap.ui.define([ // E.g. in "./model/numberFormatter.js"
     // ...
   ], function(/*...*/) {
     "use strict";
     // ...
     return function(/*...*/) {
       return /*...*/;
     };
   });
   

2. 需要并在任何需要的地方使用该格式化程序。例如，在使用core:require-syntax的视图定义中（从UI5 1.69开始受支持）：

   core:require

除非格式化程序不需要控制器引用，否则如上所示对其进行封装可以保持控制器代码整洁，并且格式化程序也将更易于进行单元测试。