クラス IgxIconService

Ignite UI for Angular Icon サービス -

Ignite UI Icon Service は、カスタム SVG 画像を IgxIconComponent で使用できます。 指定した fontSet に従って IgxIconComponentに適用されるカスタム クラスに関連付けするために使用できます。 例:

this.iconService.registerFontSetAlias('material', 'material-icons');
this.iconService.addSvgIcon('aruba', '/assets/svg/country_flags/aruba.svg', 'svg-flags');

階層

  • IgxIconService

コンストラクタ

constructor

  • new IgxIconService(_sanitizer: DomSanitizer, _document: any): IgxIconService

アクセサー

defaultFontSet

  • get defaultFontSet(): string
  • set defaultFontSet(className: string): void
  • デフォルト フォント セットを返します。

      const defaultFontSet = this.iconService.defaultFontSet;

    返却 string

  • デフォルト フォント セットを設定します。

      this.iconService.defaultFontSet = 'svg-flags';

    パラメーター

    • className: string

    返却 void

メソッド

addSvgIcon

  • addSvgIcon(iconName: string, url: string, fontSet?: string): void
  • キャッシュに SVG 画像を追加します。SVG ソースは url です。

      this.iconService.addSvgIcon('aruba', '/assets/svg/country_flags/aruba.svg', 'svg-flags');

    パラメーター

    • iconName: string
    • url: string
    • デフォルト値 fontSet: string = ""

    返却 void

addSvgIconFromText

  • addSvgIconFromText(iconName: string, iconText: string, fontSet?: string): void
  • キャッシュに SVG 画像を追加します。SVG ソースはテキストです。

      this.iconService.addSvgIcon('simple', '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 200 200">
      <path d="M74 74h54v54H74" /></svg>', 'svg-flags');

    パラメーター

    • iconName: string
    • iconText: string
    • デフォルト値 fontSet: string = ""

    返却 void

fontSetClassName

  • fontSetClassName(alias: string): string
  • 指定した fontSet に関連するカスタム クラスがある場合は返します。

      const fontSetClass = this.iconService.fontSetClassName('material');

    パラメーター

    • alias: string

    返却 string

getSvgIconKey

  • getSvgIconKey(iconName: string, fontSet?: string): string
  • キャッシュした SVG 画像のキーを返します。

      const svgIconKey = this.iconService.getSvgIconKey('aruba', 'svg-flags');

    パラメーター

    • iconName: string
    • デフォルト値 fontSet: string = ""

    返却 string

isSvgIconCached

  • isSvgIconCached(iconName: string, fontSet?: string): boolean
  • 指定した SVG 画像がキャッシュに存在するかどうかを返します。

      const isSvgCached = this.iconService.isSvgIconCached('aruba', 'svg-flags');

    パラメーター

    • iconName: string
    • デフォルト値 fontSet: string = ""

    返却 boolean

registerFontSetAlias

  • registerFontSetAlias(alias: string, className?: string): this
  • 指定した fontSet の IgxIconComponent に適用するカスタム クラスを登録します。

      this.iconService.registerFontSetAlias('material', 'material-icons');

    パラメーター

    • alias: string
    • デフォルト値 className: string = alias

    返却 this