Using a class component in a story enables you to pass through properties as arguments:
const Template: Story<MyComponent> = (args) => ({
props: args,
component: MyComponent,
})
export const Default = Template.bind({});
export const Small = Template.bind({});
Small.args = {
size: 'xs'
}
Magically the arguments are mapped over as props to the component. However, when using a template it does not work:
const Template: Story<FlexDialogModalComponent> = (args) => ({
props: args,
template: `
<app-my-component>test</app-my-component>
`,
})
Now it seems obvious since it does not know where to add them. So I figured the following should be possible:
const Template: Story<FlexDialogModalComponent> = (args: { dialogModalSize }) => ({
props: args,
template: `
<app-my-component [size]="size">test</app-my-component>
`,
})
But that does not work. It gives no error but it just does nothing. Someone have an idea how to fix this?
Here are few examples that I think that could help you with your problem.