<f-flow fDraggable (fLoaded)="onLoaded()" (fReassignConnection)="reassignConnection($event)"> <f-canvas> @for (connection of connections; track connection.inputId) { <f-connection fBehavior="floating" [fReassignDisabled]="false" [fOutputId]="connection.outputId" [fInputId]="connection.inputId"> </f-connection> } <div fNode fDragHandle [fNodePosition]="{ x: 24, y: 24 }" fNodeOutput fOutputId="1">Output</div> <div fNode fDragHandle [fNodePosition]="{ x: 224, y: 24 }" fNodeInput fInputId="input-1">Input</div> <div fNode fDragHandle [fNodePosition]="{ x: 224, y: 124 }" fNodeInput fInputId="input-2">Input</div> </f-canvas> </f-flow>