Binding issue in diagram link template

GoJS
1

I use gojs with Angular wrapper.

In my diagram template definition I do the following :

 $(go.Shape,  // the arrowhead
          { fromArrow: '' }, //default value
          new go.Binding('fromArrow', 'transitionType', (transitionType, shape) =>
            // links lookup are stored in modelData so find the relevant one
            shape.part.diagram.model.modelData.links.find(l => l.transitionType === transitionType).fromArrow
          )),

It works fine when the diagram is already loaded and I drag one of my links from the palette. The binding works.

However when loading an existing diagram, the binding is not done because modelData has no properties (so links is undefined).

Is there a way to make sure the modelData is populated before the diagram template is created ?

Currently this property is set in ngOnInit :

 //initialize model data (lookup data used)
    this.diagramModelData.links = this._processDesignerService.processDesignerMetadata.paletteLinks;
2

So you are using gojs-angular.

The DiagramComponent now merges Model.modelData before merging Model.nodeDataArray:
gojs-angular/diagram.component.ts at master · NorthwoodsSoftware/gojs-angular · GitHub
gojs-angular/ng-diagram-helper.ts at master · NorthwoodsSoftware/gojs-angular · GitHub

3

Yes, I am using gojs-angular. However I still use version 1.0.13. I have other issues with latest version.

Does it help to know this to figure out what’s going on ?

4

The binding isn’t being evaluated, since it listens on the “transitionType” field of your node data, not modelData.links. So, when modelData.links is set, the binding doesn’t fire.

A few options:

  • Rewrite the data binding so it listens for changes to modelData.links (make it an ofModel binding). More elegant, more recommended

or

  • Explicitly call updateTargetBindings on the nodes you need to update, after modelData.links is set in ngOnInit (less elegant, less recommended)
5

sorry for not getting back to you ealier, I got caught up with other things and I wanted to migrate to gojs-angular2 before tackling this issue.

I had another look and in fact, it was only a silly error in my binding. I don’t know about your two solutions, might just be a misunderstanding but the way I have done it above works just fine now.