Two way binding issue


When I use 2 way binding for this text block it doesnt show the whole text only the first word shows up.
Text Shows: Exclusive
Expected: Exclusive gateway
image
When I pass the data from

  public diagramNodeData: any = [
    { id: "1", key: "1", category: CanvasEntitiesCategory.EXCLUSIVE, name: "Exclusive gateway" }
  ]

it works properly.
Any solution?

Could you please tell us how to reproduce the problem? I am unable to reproduce the problem in either Firefox or Chrome.

  function init() {
    var $ = go.GraphObject.make;

    myDiagram =
      $(go.Diagram, "myDiagramDiv");

    myDiagram.nodeTemplate =
      $(go.Node, "Vertical",
        $(go.Shape, "Diamond",
          { fill: "white", width: 40, height: 40, portId: "" }),
        $(go.TextBlock, "Exclusive gateway",
          { font: "12px sans-serif", editable: true, isMultiline: true,
            height: 35, maxSize: new go.Size(130, 35),
            maxLines: 2, textAlign: "center" },
          new go.Binding("text", "name").makeTwoWay())
      );

    myDiagram.model =
      $(go.GraphLinksModel,
        {
          nodeDataArray: [
            { key: 1, name: "Alpha" },
            { key: 2, name: "Exclusive gateway" }
          ],
          linkDataArray: [
            { from: 1, to: 2 }
          ]
        });
  }

image

BTW, it would help if you posted textual code rather than screenshots of code.

 myDiagram.nodeTemplate =
      $(go.Node, "Vertical",
        $(go.Shape, "Diamond",
          { fill: "white", width: 40, height: 40, portId: "" }),
        $(go.TextBlock, "Exclusive gateway",
          { font: "12px sans-serif", editable: true, 
               isMultiline: true,
            text:"Exclusive gateway",
            height: 35, maxSize: new go.Size(130, 35),
            maxLines: 2, textAlign: "center" },
          new go.Binding("text", "name").makeTwoWay())
      );

This one doesnt print, gateway text

Here’s what I get with your node template and your model data (although I had to remove your category, because I have no idea what that is):
image

Isn’t this what you want?

However, I advise you not to set both the height and the maxSize.height in case the actual font used on the user’s device happens to be bigger than expected. If it is too short to actually show both lines of text the bottom one might be wrapped, causing it not to be shown due to the maxLines being 2. Which is my guess for the behavior that you are seeing.