1

我想在模板内的组件与其父级之间使用双向数据绑定。数据绑定运行良好的一种方式。但是当我修改从 RenderFragment 传递的上下文时，这个修改不会传播到模板（容器）。这是示例。

这是模板定义。我们有一个表单，我们希望能够在模型的函数中指定表单的内容。

@typeparam TItem
@typeparam TItemDtoCU
@typeparam TDataService

<EditForm Model="@Item" OnValidSubmit="HandleValidSubmit" class="item-editor">
    <DataAnnotationsValidator />

    @FormContentTemplate(Item)

    <span class="save">
        <MatButton Type="submit" Raised="true">Save</MatButton>
        <MatButton Type="reset" Raised="true" OnClick="HandleCancelSubmit">Cancel</MatButton>
    </span>
</EditForm>

这是我使用这个模板的地方

        <ModelEditorTemplate TItem="ClassName"
                             TItemDtoCU="OtherClassName"
                             TDataService="ServiceClassName"
                             ItemId="SelectedItem?.Id"
                             OnItemAdded="ItemAdded"
                             OnItemUpdated="ItemUpdated">

            <FormContentTemplate>
                <span>

                    <MatTextField Label="Name" @bind-Value="context.Name" @bind-Value:event="onchange" />
                    <ValidationMessage For="@(() => context.Name)" />
                </span>
            </FormContentTemplate>
        </ModelEditorTemplate>

当用户修改MatTextField字段时，将重置为模板组件提供的初始值。

你有想法吗 ？

编辑 1：有关我们获取数据的方式的更多信息

是的，TDataService 正在从 REST Api 获取组件。这里链接到模板的部分类：

    public partial class ModelEditorTemplate<TItem, TItemDtoCU, TDataService> : ParentThatInheritsFromComponentBase
        where TItem : BaseEntity, new()
        where TDataService : ICrudService<TItem, TItemDtoCU>
    {
        public TItem Item = new TItem();
        [Inject]
        protected TDataService DataService { get; set; }

        protected override async Task OnParametersSetAsync()
        {
             //...
             await LoadItem();
             // ...
        }

        protected async Task LoadItem()
        {
            //...
            Item = await DataService.Get(ItemId.Value);
            // ....
        }
}
4

1 回答 1

1

当FormContentTemplateRenderFragment 中的字段更新模型时，它会触发OnParametersSetAsync模板的方法，该方法再次从服务器获取数据，更新模型，然后覆盖用户所做的修改。

没有问题，模板内的表单输入只是对它的工作原理有不好的理解。

SetParametersAsync我通过使用检查更改的参数是否是我正在寻找的参数而不是 RenderFragment 来纠正问题。ItemId是记录的 id，我从 DataService 中获取。

        public override async Task SetParametersAsync(ParameterView parameters)
        {
            _hasIdParameterChange = false;

            if(parameters.TryGetValue(nameof(ItemId), out int? newItemIdValue))
            {
                _hasIdParameterChange = (newItemIdValue != ItemId);
            }

            await base.SetParametersAsync(parameters);
        }
于 2020-04-28T15:40:44.390 回答