Storybook: how to validate form inside component on user interaction?

Question

A Storybook newbie here. I have an Angular component with a FormControl, which when set to touched, might show an error (depending on the user interaction with the component itself). I've read this: https://storybook.js.org/docs/angular/writing-stories/decorators and tried adding a wrapper for the component which only contained a button. The idea was that user can click a button and thus validate the control inside the component. Didn't happen. Here is my setup:

   export default {
      title: 'Some title',
      component: Component,
      decorators: [
         moduleMetadata: [...],
         componentWrapperDecorator((story)=>`
           <div>${story}</div>
           <button (click)="doValidate"></button>
         `),
      ]
   } as Meta<Component>;
  
   const template: Story<Component> = ( args: Component ) => {
      component: Component,
      props: args,
      methods: {
         doValidate(): void {
            args.formControl.markAsTouched();
         }
      }
   });

   export const validate = template.bind({});

I concur that the method definition is out of place here. So here is the question: how do I trigger/set/mutate something inside a component from that wrapper?