Question

我正在尝试使用angular6-json-schema-form在我的angular 8应用程序中显示不同的形式。

我已经创建了一个FormTemplate模型，该模型包含一些有关需要显示的表单的属性，并使该对象成为可观察的对象，并且还可以通过共享服务使用

使其可用。

@Injectable({
    providedIn: 'root'
})

在不同的组件中，我正在观察该对象，实际上，每次对对象进行更改时，我都会通过next（）方法接收通知。

在我的组件之一中，我正在使用json-schema-form选择器显示表单，同时确保对架构，布局和数据使用属性绑定，如下所示：

<json-schema-form
loadExternalAssets="true"
[schema]="currentSchema"
[layout]="currentLayout"
[(data)]="currentData"
[debug]="true" 
language="fr"
framework="material-design"
(onChanges)="onJsonSchemaFormChange($event)"
(onSubmit)="onJsonSchemaFormSubmit($event)"
(isValid)="isValidJsonSchemaForm($event)"
(validationErrors)="jsonSchemaFormValidationErrors($event)"
(formSchema)="showJsonSchemaFormSchema($event)"
(formLayout)="showJsonSchemaFormLayout($event)"
>
</json-schema-form>

我知道我正在对数据属性使用2种方式的绑定，但这是从示例中获取的，我希望它能按原样工作。

当我在组件的.ts文件中的next（）方法中更改this.currentData的值时，表单不会在屏幕上更新和刷新。

next(myFormTemplate: FormTemplate) {

    //This shows the values before the change, exactly as they appear on screen on the generated form
    console.log('BEFORE');
    console.log(this.currentData);

    this.currentData = {
        first_name: 'new',
        last_name: 'very new'
    };

    //This shows the updated values after the change, even though it's not updated on screen on the generated form
    console.log('AFTER');
    console.log(this.currentData);
}

我真的需要这样做，因为我的真正目标是显示一个表单，并让用户使用下拉菜单在此表单和第二个表单之间切换。我希望每次更改架构，布局或数据时都可以动态修改表单。

有人可以帮忙吗？

谢谢！

Answer 1

事实证明，这与angular6-json-schema-form无关。我用跨度尝试了同一件事，该跨度显示了对象内部字符串属性的插值，并且在next（）方法中更改值也不起作用。

经过多次试验，我发现我的观察方式（调用subscribe并传递“ this”，同时确保在类的其他位置定义了next（）和error（）方法，从而满足PartialObserver接口））这样做的目的是，即使ngZone告诉我在next（）方法中执行的代码正在Angular Zone中发生，但更改检测没有发生。通过在预订时内联定义我的next（）方法使我的问题消失了。

Answer 2

添加到接受的答案中。我有一个相似的目标和一个相似的问题，我尝试了很多事情，但是我使用[[model）]而不是[[data）]来绑定我的表单值，我注意到这里您正在使用[[数据）]，所以我决定尝试一下，但没有成功，但是我尝试了一种单向绑定方式，因此[数据]就像魅力一样！

尝试动态更新生成的angular6-json-schema-form

2 个答案: