使用带有 angular 的 ui-select 标记，正式将函数传递给属性标记

Question

我已经创建了一个自定义模板 angular-formly 使用 ui-select 来标记输入：

formlyConfig.setType({
        name: 'ui-tagging',
        extends: 'select',
        template: '<ui-select multiple tagging="" tagging-label="(\'new\')" ng-model="model[options.key]" theme="bootstrap" ng-required="{{to.required}}" ng-disabled="{{to.disabled}}"> <ui-select-match placeholder="{{to.placeholder}}"> {{$select.selected[to.labelProp || \'name\']}} </ui-select-match> <ui-select-choices repeat="option in to.options | filter: $select.search"> <div ng-bind-html="option | highlight: $select.search"></div> </ui-select-choices> </ui-select>',
    });

这是问题所在，我想设置一个函数来标记属性以转换标签，例如 ui-select 文档中的示例。

<ui-select tagging="tagTransform" .....

Plunker ui-select 示例：http://plnkr.co/edit/m1SQXUxftBLQtitng1f0?p=preview

Answer 1

为此，您只需在字段选项中引用一个函数。类似于：options.templateOptions.tagTransform（有一个快捷方式：to.tagTransform）。所以你可以有这样的东西：

formlyConfig.setType({
        name: 'ui-tagging',
        extends: 'select',
        template: '<ui-select multiple tagging="to.tagTransform()" tagging-label="(\'new\')" ng-model="model[options.key]" theme="bootstrap" ng-required="{{to.required}}" ng-disabled="{{to.disabled}}"> <ui-select-match placeholder="{{to.placeholder}}"> {{$select.selected[to.labelProp || \'name\']}} </ui-select-match> <ui-select-choices repeat="option in to.options | filter: $select.search"> <div ng-bind-html="option | highlight: $select.search"></div> </ui-select-choices> </ui-select>',
    });

字段配置类似于：

{
  type: 'ui-tagging',
  templateOptions: {
    tagTransform: function() {}
  }
}

使用带有 angular 的 ui-select 标记，正式将函数传递给属性标记

Using the ui-select tagging with angular formly passing a function to attribute tagging

angularjs

angular-formly