Angular Inputs and Outputs
· 3 min read
One of the core concepts when working with components in Angular is that of @Inputs and @Outputs. For instance, maybe you have some component that expects to be told what text to use as its title, and which will output an event when the user clicks a button:
@Component({
selector:"app-my-component",
template:`
<div>
<h1>{{title}}</h1>
<button class="btnEmit" (click)="emitEvent('test')">Click Me</button>
</div>
`
})
export class MyComponent {
@Input() title:string
@Output() outputEvent = new EventEmitter<string>()
emitEvent(value:string) {
this.outputEvent.emit(value)
}
}
From version 5.6.2, JsPlumb's Angular integration now offers a couple of ways of working with these that earlier versions did not support.