Question

我有一个下拉指令，想添加到我的故事书中，该指令不起作用。当我运行该按钮时，将显示在故事书上，但如果单击该按钮，则不会显示该模板。

import {moduleMetadata} from '@storybook/angular';
import {CommonModule} from '@angular/common';
import {DropdownModule} from '../../app/base-components/dropdown';

export default {
  title: 'dropdown',
  decorators: [
    moduleMetadata({
      declarations: [],
      imports: [CommonModule, DropdownModule]
    })
  ]
};

export const withDropdownTemplate = () => ({
  template: '<button dropDown></button>',
  props: {
    displayTpl: `<ng-template #dropdownTpl>
  <ul>
    Hello World
  </ul>
</ng-template>`
  }
});

Answer 1

我有同样的问题。

我的解决方案： https://github.com/AnteaterCode/shatilokit/blob/master/src/stories/general/buttons.stories.ts

const modules = {
  imports: [
    ShButtonModule,
  ],
};

export default {
  title: 'general/Button',
  component: ShButton
} as Meta;


export const primary = () => ({
  moduleMetadata: modules,
  template: `
    <button shButton> Button </button>
  `,
});

如何在有角故事书中添加指令

1 个答案: