使用表达式属性访问不同的模型模板选项

Using ExpressionProperties to access different model templateOptions

本文关键字:模型 选项 表达式 属性 访问      更新时间:2023-09-26

首先,我想说Angular Formly对于像我这样的新手来说是一个很棒的库。我不是 Web 开发人员,但是发现这个库直观且功能强大。

但是,我确实需要有关使用表达式属性的帮助。

我有一个包含库项目的模型库,例如:

{
  "itemId":"STX001",
  "title":"Grey Wolf",
  "category":"White", etc.
}
{
  "itemId":"STX002",
  "title":"Noble Black",
  "category":"Black", etc.
}
etc.

我还有一个表单,它使用 top 字段中的 ui-select 从库中查找所有值,选择其中一个(我称之为Item),然后用 Items 属性填充表单中的其余字段,然后将表单提交到Catalogue模型。

面临的问题是我无法从其他字段中引用Item的属性。我尝试使用expressionProperties但只能提取valueProp值(这是唯一ID),但是我在Item.title,Item.category等之后。

代码如下:

{
 //This is form fields for creating a new Catalogue entry
 key: 'libraryId',
 type: 'ui-select',
 templateOptions: {
    label: gettextCatalog.getString('Search Library'),
    options: [],
    valueProp: 'itemId',
    itemTitle: 'title',
    itemCategory: 'category',
    labelProp: 'title',
    focus: true,
    placeholder: 'Start typing keywords..'
 },
 controller: function ($scope) {
   getLibrary().then(function(data){
       $scope.options.templateOptions.options = data;
       return data;
   });
 }
}
{
 key: 'title',
 type: 'input',
 templateOptions: {
    label: gettextCatalog.getString('Name'),
    required: true
 },
 expressionProperties : {
   //This is what i'm trying to achieve but doesn't work
   'templateOptions.placeholder' : 'model.libraryId.itemTitle'
 }
},

使用提供的回调函数

expressionPropertyObj = {
                    'templateOptions.required': (model, formState: any, field: FormlyFieldConfig) => {
                        console.log('model',model);
                        console.log('state',formState);
                        console.log('field',field);
                      
                    },