这是我的代码...
custom_formio.component.ts
import { Component } from '@angular/core';
import { Router } from '@angular/router';
import { FormioAuthService } from 'angular-formio/auth';
import { Formio } from 'formiojs';
import { SelectComponent } from './Select';
@Component({
selector: 'app-custom_formio',
templateUrl: './custom_formio.component.html',
styleUrls: ['./custom_formio.component.less']
})
export class CustomFormioComponent {
builder: any;
title = 'app';
offlineCount = 0;
offlineMode: any = null;
offlineError = '';
constructor(private auth: FormioAuthService, private router: Router) {
this.auth.onLogin.subscribe(() => {
this.router.navigate(['/home']);
});
this.auth.onLogout.subscribe(() => {
this.router.navigate(['/auth/login']);
});
this.auth.onRegister.subscribe(() => {
this.router.navigate(['/home']);
});
Formio.registerComponent('custom_formio', SelectComponent);
}
}
在SelectComponent上是我在Select.js中创建的自定义formio组件,该组件将在https://formio.github.io/formio.js/docs/file/src/components/select/Select.js.html#lineNumber36上提供,为此,我添加了如下代码。
// Use the table component edit form.
SelectComponent.editForm = TableComponent.editForm;
// Register the component to the Formio.Components registry.
Components.addComponent('custom_formio', SelectComponent);
Formio.builder(document.getElementById('builder'), {}, {
builder: {
basic: false,
advanced: false,
data: false,
layout: false,
customBasic: {
title: 'Basic Components',
default: true,
weight: 0,
components: {
select: true
}
}
}
}).then(function(builder) {
Formio.createForm(document.getElementById('formio'), {}).then(function(instance) {
var json = document.getElementById('json');
instance.on('change', function() {
json.innerHTML = '';
json.appendChild(document.createTextNode(JSON.stringify(instance.submission, null, 4)));
});
builder.on('change', function(schema) {
if (schema.components) {
instance.form = schema;
}
});
});
});
现在我想将此ID呈现为html,因为我是在上述代码的下方创建的,例如Formio.builder(document.getElementById('builder'),{},{} 在html中,我将此ID称为...
<div id="builder"></div>
但是我无法读取'builder'的属性未定义。 有人可以建议如何解决这个问题吗?...