无法读取未定义问题的属性“生成器”

时间:2019-03-12 14:31:21

标签: html angular typescript

这是我的代码...

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'的属性未定义。 有人可以建议如何解决这个问题吗?...

0 个答案:

没有答案