Question

如何使用故事书的新CSF格式通过thml标签添加组件？像这样（格式为旧故事）：

const modules = {
    imports: [ReactiveFormsModule],
    declarations: [AddressComponent],
};

storiesOf('Core/Address Component - storiesOf', module)
    .add('as component', () => ({
        moduleMetadata: modules,
        component: AddressComponent,
        props: {
            title: 'test',
        },
    }))
    .add('via html tag', () => ({
        moduleMetadata: modules,
        template: `
            <app-address title="test"></app-address>
        `,
    }));

我已经尝试过了（新的CSF格式）：

export default {
    component: AddressComponent,
    title: 'Core/AddressComponent',
    decorators: [
        moduleMetadata({
            // imports both components to allow component composition with storybook
            providers: [],
            schemas: [CUSTOM_ELEMENTS_SCHEMA],
            imports: [ReactiveFormsModule],
        }),
    ],
};
export const fromHtmlTemplate = () => ({
    component: AddressComponent,
    template: `<app-address title="testerasef"></app-address>`,
});

...但是结果只是故事书中的空白页。...

Answer 1

好的，我只是想念这个声明：

export default {
    component: AddressComponent,
    title: 'Core/AddressComponent',
    decorators: [
        moduleMetadata({
            schemas: [CUSTOM_ELEMENTS_SCHEMA],
            declarations: [AddressComponent],
            imports: [ReactiveFormsModule],
        }),
    ],
};
export const fromHtmlTemplate = () => ({
    template: `<app-address title="testerasef"></app-address>`,
});

希望，这对某人有帮助，直到故事书更新了文档...

如何使用有角的html模板编写故事书CSF故事

1 个答案: