#Custom block: how to get data from parent component with Constructor

[orlenkoo]

Hello,
Hope you are doing well..
I want to get data when create new custom block in app.component.ts in example.block.ts.

Here is the code:

• app.component.ts

import {
  Category,
  CustomBlock,
  LOGIC_CATEGORY,
  LOOP_CATEGORY,
  MATH_CATEGORY,
  NgxBlocklyConfig,
  NgxBlocklyGenerator,
  NgxBlocklyToolbox,
  Blockly
} from "ngx-blockly";

import { ExampleBlock } from "./blocks/example.block";

@Component({
  selector: "app-root",
  templateUrl: "./app.component.html",
  styleUrls: ["./app.component.css"]
})
export class AppComponent {
  title = "CodeSandbox";
  public config: NgxBlocklyConfig = {
    trashcan: true,
    generators: [
      NgxBlocklyGenerator.DART,
      NgxBlocklyGenerator.LUA,
      NgxBlocklyGenerator.JAVASCRIPT,
      NgxBlocklyGenerator.PHP,
      NgxBlocklyGenerator.PYTHON,
      NgxBlocklyGenerator.XML
    ],
    defaultBlocks: true,
    move: {
      scrollbars: true,
      wheel: true
    }
  };

  public customBlocks: CustomBlock[] = [new ExampleBlock([{key: "test"}])];


  constructor() {
    const workspace = new Blockly.WorkspaceSvg(new Blockly.Options({}));
    const toolbox: NgxBlocklyToolbox = new NgxBlocklyToolbox(workspace);
    toolbox.nodes = [
      LOGIC_CATEGORY,
      new Category("bla", "#ff0000", [
        ...this.customBlocks,
      ]),
      LOOP_CATEGORY,
      MATH_CATEGORY,
    ];
    this.config.toolbox = toolbox.toXML();
  }
}

• example.block.ts

export class ExampleBlock extends CustomBlock {
  constructor(args: any) {
    super("example_block");
    this.class = ExampleBlock;
    // this.args = [{key:"test"}];
  }

  public defineBlock() {
    this.block.appendDummyInput().appendField(this.args[0].key);
  }

  public toPythonCode(block: Blockly.Block): string | any[] {
    return "";
  }
}

I have created new example block with args: [{key:"test"}] like:

public customBlocks: CustomBlock[] = [new ExampleBlock([{key: "test"}])];

I want to get this args in example.block.ts so that I can use for appendField like.

public defineBlock() { this.block.appendDummyInput().appendField(this.args[0].key); }

Can you help?

[roroettg]

Hi,

you could do it like this. args is already defined in a parent class.

public customBlocks: CustomBlock[] = [new ExampleBlock(null, null, [{key: "test"}])];

export class ExampleBlock extends CustomBlock {
  constructor(type: string, blockMutator?: BlockMutator, ...args: any[]) {
    super("example_block");
    this.class = ExampleBlock;
  }

  public defineBlock() {
    this.block.appendDummyInput().appendField(this.args[0].key);
  }

  public toPythonCode(block: Blockly.Block): string | any[] {
    return "";
  }
}

[orlenkoo]

Yeah, it worked..
Thanks very much