northwoodssoftware / gojs-angular-basic Goto Github PK

export class AppComponent {
@ViewChild('myDiagram', { static: true }) public myDiagramComponent: DiagramComponent;
public parentGrpColor = '#FFDD33';

public initDiagram(){
console.log(this.parentGrpColor);

When i try the above code to access variable or function it throws not defined error. I need to set the colors dynamically, and also need to retrieve data from service.

P

How can i get rid of that error am current getting running exactly codes as from from this repo?

It happens on this line "import * as go from 'gojs';" in app.component.ts and inspector.component.ts

E:\AngularProject\gojs-angular-basic>ng serve
No projects support the 'serve' target.
Error: No projects support the 'serve' target.
at ServeCommand.initialize (E:\AngularProject\gojs-angular-basic\node_modules@angular\cli\models\architect-command.js:50:19)
at process._tickCallback (internal/process/next_tick.js:68:7)
at Function.Module.runMain (internal/modules/cjs/loader.js:834:11)
at startup (internal/bootstrap/node.js:283:19)
at bootstrapNodeJSCore (internal/bootstrap/node.js:622:3)

I was trying to use the boilerplate to get better understanding of go-js in Angular
Post cloning the repo when I run 'npm install' for the repo to install its dependencies it produces the error
I am using Angular 9+ on my windows 10.
How can I resolve it?
Thanks a lot !!

"gojs": "^2.1.0-beta1",
"gojs-angular": "^1.0.1",
"@angular/common": "~8.2.9",
"@angular/compiler": "~8.2.9",
"@angular/core": "~8.2.9",

I'm running the sample just fine. Now I have added a context menu on shape (taken from he tutorial : https://gojs.net/latest/samples/blockEditor.html)

So inside the InitDiagram function, I have added the following below code. The context menu shows up just fine and the clickfunction gets fired when clicking on a menu item. The model is updated with the new shape, however the UI is not updated. The shape remains a rectangle. I believe there is some extra steps to take because of Angular. What am I missing ?

`  dia.nodeTemplate.contextMenu =
  $("ContextMenu",
    $("ContextMenuButton",
      $(go.Panel, "Horizontal",
        FigureButton("Rectangle"), FigureButton("RoundedRectangle"), FigureButton("Ellipse"), FigureButton("Diamond")
      )
    ));

function FigureButton(fig, propname = 'figure') {

  return $(go.Shape,
    {
      width: 32, height: 32, scale: 0.5, fill: "lightgray", figure: fig,
      margin: 1, background: "transparent",
      mouseEnter: (e, shape) => { shape.fill = "dodgerblue"; },
      mouseLeave: (e, shape) => { shape.fill = "lightgray"; },
      click: ClickFunction(propname, fig), contextClick: ClickFunction(propname, fig)
    });
}


// PROPNAME is the name of the data property that should be set to the given VALUE.
function ClickFunction(propname, value) {
  return (e, obj) => {
    e.handled = true;  // don't let the click bubble up
    e.diagram.model.commit((m) => {
      m.set(obj.part.adornedPart.data, propname, value);
    });
  };
`}``

The anchor should start from the PrimaryKey row and end at the ForeignKey row.

Like the below picture

we want to use gojs-debug for dev builds, when we try to pull it, we get an error that go module is already exists/created