How to use the @material/form-field.MDCFormFieldFoundation function in @material/form-field

To help you get started, we’ve selected a few @material/form-field examples, based on popular ways it is used in public projects.

Secure your code as it's written. Use Snyk Code to scan source code in minutes - no build needed - and fix issues immediately.

github trimox / angular-mdc-web / src / lib / form-field / form-field.component.ts View on Github external
},
    deregisterInteractionHandler: (type: string, handler: EventListener) => {
      /* TODO */
    },
    activateInputRipple: () => {
      /* TODO */
    },
    deactivateInputRipple: () => {
      /* TODO */
    }
  };

  private _foundation: {
    init: Function,
    destroy: Function
  } = new MDCFormFieldFoundation(this._mdcAdapter);

  constructor(private _renderer: Renderer2, private _root: ElementRef) { }

  ngAfterViewInit() {
    this._foundation.init();
  }
  ngOnDestroy() {
    this._foundation.destroy();
  }
}
github jamesmfriedman / rmwc / src / formfield / index.tsx View on Github external
getDefaultFoundation() {
    // For RMWC, the entire foundation is a noop. Interactions and ripples are controlled
    // on the components themselves
    return new MDCFormFieldFoundation({
      registerInteractionHandler: (
        evtType: K,
        handler: SpecificEventListener
      ): void => {},
      deregisterInteractionHandler: (
        evtType: K,
        handler: SpecificEventListener
      ): void => {},
      activateInputRipple: () => {},
      deactivateInputRipple: () => {}
    });
  }
github src-zone / material / bundle / src / components / form-field / mdc.form-field.directive.ts View on Github external
registerInteractionHandler: (type: string, handler: EventListener) => {
            this.registry.listen(this.renderer, type, handler, this.root);
        },
        deregisterInteractionHandler: (type: string, handler: EventListener) => {
            this.registry.unlisten(type, handler);
        },
        activateInputRipple: () => {
            if (this.rippleChild)
                this.rippleChild.activateRipple();
        },
        deactivateInputRipple: () => {
            if (this.rippleChild)
                this.rippleChild.deactivateRipple();
        }
    };
    private foundation: { init: Function, destroy: Function } = new MDCFormFieldFoundation(this.mdcAdapter);

    constructor(private renderer: Renderer2, private root: ElementRef, private registry: MdcEventRegistry) {
    }

    ngAfterContentInit() {
        if (this.mdcInput != null && this.mdcLabel != null) {
            if (this.mdcInput.id == null && this.mdcLabel.for == null)
                this.mdcInput.id = this.mdcLabel.for = `mdc-form-input-${nextId++}`;
            else if (this.mdcInput.id == null)
                this.mdcInput.id = this.mdcLabel.for;
            else if (this.mdcLabel.for == null)
                this.mdcLabel.for = this.mdcInput.id;
        }
        this.foundation.init();
    }
github material-components / material-components-web-components / packages / formfield / mwc-formfield.ts View on Github external
firstRendered() {
    const label = this.shadowRoot.querySelector('label');
    this._foundation = new MDCFormFieldFoundation({
      registerInteractionHandler: (type, handler) => label.addEventListener(type, handler),
      deregisterInteractionHandler: (type, handler) => label.removeEventListener(type, handler),
      activateInputRipple: () => {
        if (this._input && this._input.ripple) {
          this._input.ripple.activate();
        }
      },
      deactivateInputRipple: () => {
        if (this._input && this._input.ripple) {
          this._input.ripple.deactivate();
        }
      },
    });
  }