ng-admin：如何根据用户的选择显示不同的字段？答案

【问题标题】：Ng-admin: How to show different fields according to user's selection?ng-admin：如何根据用户的选择显示不同的字段？
【发布时间】：2024-01-21 02:34:01
【问题描述】：

我正在使用 ng-admin 来编写一个管理员管理。我遇到了以下问题，有人可以帮助我吗？

在我的创作视图中，我想根据“类型”字段的选择显示不同的字段（文本/视频/图片）。我怎么能做到？

var articles = nga.entity('articles');
articles.creationView().fields([
      nga.field('type','choice')
            .validation({ required: true })
            .choices([
                // 1: txt, 2: pic, 3: vid
                { value: 1, label: 'Text'},
                { value: 2, label: 'Picture'},
                { value: 3, label: 'Video'},
            ]),
      nga.field('txt','file')
          .attributes({ placeholder: 'Write something... !' }),
      nga.field('pic','file')
          .label('Picture(.jpg|.png)')
          .uploadInformation({ 'url': '/api/adminapi/uploadPicture', 'apifilename': 'pictures', 'accept': 'image/jpg,image/png'}),
      nga.field('vid','file')
         .label('Video(.mp4)')
         .uploadInformation({ 'url': '/api/adminapi/uploadVideo', 'apifilename': 'video', 'accept': 'video/mp4'}),

])

【问题讨论】：

标签： angularjs ng-admin

【解决方案1】：

Field Configuration 文档页面解释了如何使用“模板”字段配置来执行此操作：

template(String|Function, templateIncludesLabel=false) 所有字段类型支持 template() 方法，可以轻松自定义特定领域的外观和感觉，而不牺牲当地人功能。

...

强制模板替换整行（包括标签），将 true 作为第二个参数传递给模板（）调用。这对于有条件地隐藏字段非常有用根据条目的属性：

post.editionView() .fields([ nga.field('category', 'choice') .choices([ { label: 'Tech', value: 'tech' }, { label: 'Lifestyle', value: 'lifestyle' } ]), nga.field('subcategory', 'choice') .choices(function(entry) { return subCategories.filter(function (c) { return c.category === entry.values.category; }); }) // display subcategory only if there is a category .template('<ma-field ng-if="entry.values.category" field="::field" value="entry.values[field.name()]" entry="entry" entity="::entity" form="formController.form" datastore="::formController.dataStore"></ma-field>', true), ]);

【讨论】：

【解决方案2】：

我只有一个工作循环方法。那就是使用 .attributes(onclick, "return updateButton();") 作为 nga.field("type")。在 updateButton() 方法中，将有助于检查当前的 'type' 字段值并使用 DOM 方法来更改按钮的启用和禁用。

但是，如果将来可以支持此要求，我仍然非常感激。这将有助于用户轻松制作 UI 控件。

【讨论】：