See params.component.ts you have toggle light and power for example:
<div class="button-icon sep-icon" *ngIf="printer?.config?.general?.softwareLight">
<rs-button class="secondary outline full" (hit)="printerAction.toggleCaseLights(printer.slug)">
<i class="rs rs-light fw"></i>
<h3><?php _('Light On/Off') ?></h3>
</rs-button>
</div>
<div class="button-icon sep-icon" *ngIf="printer?.config?.general?.softwarePower">
<rs-button class="secondary outline full" (hit)="printerAction.power(printer.slug)">
<i class="fa fa-power-off fw"></i>
<h3><?php _('Power On/Off') ?></h3>
</rs-button>
</div>
And when you see what printerAction does here:
power(slug: string) {
return this.connectionHandler.send("send", {cmd: "@runButtonCommand togglePower"}, slug);
}
It is just sending a g-code also here it is a server-command. But it could be any g-code marlin can understand.
On/off is a bit difficult as you must know what the current state is. Easiest is to use server-commands which set a global variable and a @func you could call when button is pressed. With parsing marlin responses you can set the variable when it contains a state change for that setting.