Logo for jsDocs.io

@angular2-material/icon

  • Version 2.0.0-alpha.8-3
  • Published
  • No dependencies
  • MIT license

Install

npm i @angular2-material/icon
yarn add @angular2-material/icon
pnpm add @angular2-material/icon

Overview

Angular 2 Material icon

Index

Classes

Classes

class MdIcon

class MdIcon implements OnChanges, OnInit, AfterViewChecked {}

  • Component to display an icon. It can be used in the following ways: - Specify the svgSrc input to load an SVG icon from a URL. The SVG content is directly inlined as a child of the component, so that CSS styles can easily be applied to it. The URL is loaded via an XMLHttpRequest, so it must be on the same domain as the page or its server must be configured to allow cross-domain requests. Example:

    - Specify the svgIcon input to load an SVG icon from a URL previously registered with the addSvgIcon, addSvgIconInNamespace, addSvgIconSet, or addSvgIconSetInNamespace methods of MdIconRegistry. If the svgIcon value contains a colon it is assumed to be in the format "[namespace]:[name]", if not the value will be the name of an icon in the default namespace. Examples:

    - Use a font ligature as an icon by putting the ligature text in the content of the component. By default the Material icons font is used as described at http://google.github.io/material-design-icons/#icon-font-for-the-web. You can specify an alternate font by setting the fontSet input to either the CSS class to apply to use the desired font, or to an alias previously registered with MdIconRegistry.registerFontClassAlias. Examples: home sun

    - Specify a font glyph to be included via CSS rules by setting the fontSet input to specify the font, and the fontIcon input to specify the icon. Typically the fontIcon will specify a CSS class which causes the glyph to be displayed via a :before selector, as in https://fortawesome.github.io/Font-Awesome/examples/ Example:

constructor

constructor(
    _element: ElementRef,
    _renderer: Renderer,
    _mdIconRegistry: MdIconRegistry
);

    property alt

    alt: string;

      property fontIcon

      fontIcon: string;

        property fontSet

        fontSet: string;

          property hostAriaLabel

          hostAriaLabel: string;

            property svgIcon

            svgIcon: string;

              property svgSrc

              svgSrc: string;

                method ngAfterViewChecked

                ngAfterViewChecked: () => void;

                • TODO: internal

                method ngOnChanges

                ngOnChanges: (changes: { [propertyName: string]: SimpleChange }) => void;

                • TODO: internal

                method ngOnInit

                ngOnInit: () => void;

                • TODO: internal

                class MdIconInvalidNameError

                class MdIconInvalidNameError extends MdError {}

                • Exception thrown when an invalid icon name is passed to an md-icon component.

                constructor

                constructor(iconName: string);

                  class MdIconModule

                  class MdIconModule {}

                    method forRoot

                    static forRoot: () => ModuleWithProviders;

                      class MdIconRegistry

                      class MdIconRegistry {}

                      • Service to register and display icons used by the component. - Registers icon URLs by namespace and name. - Registers icon set URLs by namespace. - Registers aliases for CSS classes, for use with icon fonts. - Loads icons from URLs and extracts individual icons from icon sets.

                      constructor

                      constructor(_http: Http);

                        method addSvgIcon

                        addSvgIcon: (iconName: string, url: string) => this;

                        • Registers an icon by URL in the default namespace.

                        method addSvgIconInNamespace

                        addSvgIconInNamespace: (
                            namespace: string,
                            iconName: string,
                            url: string
                        ) => this;

                        • Registers an icon by URL in the specified namespace.

                        method addSvgIconSet

                        addSvgIconSet: (url: string) => this;

                        • Registers an icon set by URL in the default namespace.

                        method addSvgIconSetInNamespace

                        addSvgIconSetInNamespace: (namespace: string, url: string) => this;

                        • Registers an icon set by URL in the specified namespace.

                        method classNameForFontAlias

                        classNameForFontAlias: (alias: string) => string;

                        • Returns the CSS class name associated with the alias by a previous call to registerFontClassAlias. If no CSS class has been associated, returns the alias unmodified.

                        method getDefaultFontSetClass

                        getDefaultFontSetClass: () => string;

                        • Returns the CSS class name to be used for icon fonts when an component does not have a fontSet input value, and is not loading an icon by name or URL.

                        method getNamedSvgIcon

                        getNamedSvgIcon: (name: string, namespace?: string) => Observable<SVGElement>;

                        • Returns an Observable that produces the icon (as an DOM element) with the given name and namespace. The icon must have been previously registered with addIcon or addIconSet; if not, the Observable will throw an MdIconNameNotFoundError.

                        method getSvgIconFromUrl

                        getSvgIconFromUrl: (url: string) => Observable<SVGElement>;

                        • Returns an Observable that produces the icon (as an DOM element) from the given URL. The response from the URL may be cached so this will not always cause an HTTP request, but the produced element will always be a new copy of the originally fetched icon. (That is, it will not contain any modifications made to elements previously returned).

                        method registerFontClassAlias

                        registerFontClassAlias: (alias: string, className?: string) => this;

                        • Defines an alias for a CSS class name to be used for icon fonts. Creating an mdIcon component with the alias as the fontSet input will cause the class name to be applied to the element.

                        method setDefaultFontSetClass

                        setDefaultFontSetClass: (className: string) => this;

                        • Sets the CSS class name to be used for icon fonts when an component does not have a fontSet input value, and is not loading an icon by name or URL.

                        Package Files (3)

                        Dependencies (0)

                        No dependencies.

                        Dev Dependencies (0)

                        No dev dependencies.

                        Peer Dependencies (2)

                        Badge

                        To add a badge like this onejsDocs.io badgeto your package's README, use the codes available below.

                        You may also use Shields.io to create a custom badge linking to https://www.jsdocs.io/package/@angular2-material/icon.

                        • Markdown
                          [![jsDocs.io](https://img.shields.io/badge/jsDocs.io-reference-blue)](https://www.jsdocs.io/package/@angular2-material/icon)
                        • HTML
                          <a href="https://www.jsdocs.io/package/@angular2-material/icon"><img src="https://img.shields.io/badge/jsDocs.io-reference-blue" alt="jsDocs.io"></a>