importXML issue(bpmn file angular)


Hi.I am using bpmn with angular 4.When importing bpmn file and attaching customElements with the modeler i am facing the issue of undefined .The exact error on console is
cannot read property ‘modeler’ of undefined
The code in ngOnInit is

const url = 'assets/bpmn/initial.bpmn';
    this.http.get(url, {
      headers: {observe: 'response'}, responseType: 'text'
      (x: any) => 
        this.modeler.importXML(x, function(err){

The code is simple.It basically import bpmn file and after that it attaches he customElements form json file with the xml.This part is important in my case.Attaching customElements with the xml file.My bpmn package version in package.json is
"bpmn-js": “^2.4.1”,

Any help in this issue is highly appreciated




thanks .But on the other hand if i remove the lines inside call back function,the error does not appear any more.Can you kindly elaborate the answer more



Please try to understand why.


I have initialized this.modeler earlier with

this.modeler = new CustomModeler({
      container: '#canvas',
       keyboard: {
        bindTo: document
      width: '100%',
      height: '600px',
        // PropertiesPanelModule,
        {[InjectionNames.bpmnPropertiesProvider]: ['type', OriginalPropertiesProvider.propertiesProvider[1]]},
        {[InjectionNames.propertiesProvider]: ['type', CustomPropsProvider]},
      propertiesPanel: {
        parent: '#properties'
      moddleExtension: {
        custom: customModdle


Please make sure you understand how this works in JavaScript. The error you get has nothing to do with bpmn-js.


thanks alot.this issue is solved