@eafmm/ng NPM | npm.io

Form Minimap Angular

Angular module with components for Form Minimap. Please consult that documentation for further information on the concepts mentioned below. Please note that all boolean attributes are existential (value ignored) rather than having a boolean value.

Demo Appplication

Getting Started

Installation

npm install --save @fmm/ng

Adding Form Minimap

The code sample below shows the lines added to a simple form to add a minimap (M) or a minimap with panel (P)

            import { Component, NgModule } from '@angular/core';
            import { BrowserModule } from '@angular/platform-browser';
M P         import { FmmNgModule } from '@eafmm/ng'

            @Component({
                selector: 'app-root',
                template: ` <div>
M P                 <div #anchor style='width:20px; height:20px; margin-left:200px'></div>
  P                 <fmm-ng-panel #panel></fmm-ng-panel>
                    <form>
M                       <fmm-ng-minimap [anchor]='anchor' title='Title'></fmm-ng-minimap>
  P                     <fmm-ng-minimap [anchor]='anchor' [panel]='panel' title='Title'></fmm-ng-minimap>
                        <input id="Input1"/><br/>
                        <input id="Input2"/><br/>
                        <input id="Input3"/><br/>
                        <input id="Input4"/>
                    </form>
                </div>`,
                styles: []
            })
            export class AppComponent { }

            @NgModule({
                declarations: [AppComponent],
                imports: [BrowserModule
M P                     , FmmNgModule
                ],
                providers: [],
                bootstrap: [AppComponent]
            })
            export class AppModule { }

API

FmmNgModule

Module containing all the components.

| Components | --- | FmmNgMinimap | FmmNgPanel

FmmNgMinimap

Component to create and manage a FmmMinimap. The minimap is detached when this component is destroyed. For minimaps in a panel, use the panel property; otherwise use an anchor for a popup minimap.

Attribute	Type	Required	Description
aggregateLabels	FmmMapString
anchor	HTMLElement
customElementIds	string[]
debounceMsec	number
dynamicLabels	string[]
formGroup	FormGroup		FormGroup that contains the form's controls.
framework	FmmFramework
key	string		Minimap is recreated when key changes. Any previous minimap is detached.
namelessControls	FmmNgNamelessControls (= Record<string, AbstractControl>)		Additional FormControls, dentified by their form element's ID or NAME attribute, which may not be discoverable by traversing up the DOM tree and looking up formArrayName, formControlName, or formGroupName attribute on DOM elements.
ordinal	number
page	HTMLElement
panel	FmmNgPanel	✓
title	string	✓
usePanelDetail	existential
useWidthToScale	existential
verbosity	number
zoomFactor	number