WML Mobile Nav

The Angular WML Mobile Nav library offers a comprehensive solution for integrating a mobile navigation menu into Angular applications. It’s designed to enhance user experience on mobile devices by providing a dynamic and responsive navigation system. The library leverages Angular’s powerful framework to offer a seamless and interactive menu system, which is both easy to integrate and customizable to fit the specific needs of an application. The primary goal of the library is to simplify the implementation of a mobile navigation menu, providing developers with a set of tools that facilitate the creation of a multi-level, collapsible, and accessible navigation structure.

Central to the library is the WMLMobileNavZeroComponent, which acts as the main container for the navigation system. This component utilizes the WMLInfiniteDropdownZeroProps to dynamically generate a mobile-friendly, nested dropdown structure. The interactivity within the components allows for a highly customizable user experience, enabling developers to define their navigation hierarchy and visual style with ease. Customization is further supported through a variety of parameters and methods, allowing for dynamic content loading and real-time updates to the navigation structure. The typical implementation involves integrating the WMLMobileNavZeroComponent within an Angular application, configuring its parameters to define the navigation items, and customizing its appearance and behavior to match the application’s design and functional requirements.

Installation

npm install -s --verbose @windmillcode/angular-wml-mobile-nav @windmillcode/angular-wml-infinite-dropdown

Usage

WMLMobileNavZero

Getting Started

This is the same as adding custom components from wml infinite dropdown guide

Decent Example

For more guides refer to WML Infinite Dropdown

Reference

WMLMobileNavZeroProps

Property	Type	Description
cdrefArray	Array<ChangeDetectorRef>	Array of ChangeDetectorRef instances for manual triggering of change detection
items	Array<WMLInfiniteDropdownZeroProps>	Array of dropdown properties to define navigation items
opened	Subject<void>	Subject that emits when the navigation is opened
closed	Subject<void>	Subject that emits when the navigation is closed
isPresent	boolean	Boolean flag to control the presence of the navigation on the DOM
state	”open” \| “closed”	Current state of the navigation

Changelog

v0.0.1

project is not yet ready should be able to open and close

v0.0.2

component is fully operational

v1.0.4

you can safely rely on isPresent to by default show and hide the mobile nav on the dom
corrected dependencies
ensure if mobileProps.isPresent is set to true the component would appear on the dom
fixed major problems concerning ngx-translate

// translate
// first make sure to have ONLY ONE in the imports for AppModule
    TranslateModule.forRoot({
      defaultLanguage: 'en',
      loader: {
        provide: TranslateLoader,
        useFactory: HttpLoaderFactory,
        deps:[HttpClient]
      }
    }),
// then
WmlMobileNavZeroNGXTranslateModule
// for regular
WmlMobileNavZeroModule

mobile nav can scroll if mobile screens are too big
fixed a css issues where nav items that opened to the side were not seen

v16.2.4-0

started to name packages after angular core versioning

v16.2.4-1

isolated css to not interfere with applcation css

v16.2.5-0

made it easier to style component %!(EXTRA string=

v16.2.80

updated package to reflect the version 16.2.80 of @angular/core package),

v16.2.80

updated package to reflect the version 16.2.80 of @angular/core package,

v16.2.90

updated package to reflect the version 16.2.90 of @angular/core package,

v16.2.91

updated package to reflect the version 16.2.91 of @angular/core package,

v16.2.93

updated package to conform with @windmillcode/angular-wml-components-base for unit testing features ,

v16.2.100

updated package to conform with @windmillcode/angular-wml-components-base for unit testing features ,

v16.2.110

updated package to conform with @windmillcode/angular-wml-components-base for unit testing features ,

v16.2.120

updated package to conform with @windmillcode/angular-wml-components-base for unit testing features ,

v17.0.10

updated package to conform with @windmillcode/angular-wml-components-base for unit testing features ,

v17.0.11

updated package to conform with @windmillcode/angular-wml-components-base for unit testing features ,

v17.0.20

updated package to reflect the version ^17.0.2 of @angular/core package,

v17.0.40

updated package to reflect the version ^17.0.4 of @angular/core package,

v17.0.50

updated package to reflect the version ^17.0.5 of @angular/core package,

v17.0.60

updated package to reflect the version ^17.0.6 of @angular/core package,

v17.0.70

updated package to reflect the version ^17.0.7 of @angular/core package,

v17.0.7100

updated package to conform with @windmillcode/angular-wml-components-base ,

v17.0.7200

updated package to conform with @windmillcode/angular-wml-components-base ,

v17.0.7300

updated package to conform with @windmillcode/angular-wml-components-base ,

v17.0.80

updated package to reflect the version ^17.0.8 of @angular/core package,

v17.0.8100

updated package to conform with @windmillcode/angular-wml-components-base ,

v17.0.8102

updated package to conform with @windmillcode/angular-wml-components-base ,

v17.0.8103

updated package to conform with @windmillcode/angular-wml-components-base ,

v17.0.9000

updated package to conform with @windmillcode/angular-wml-components-base ,

v17.0.9001

updated package to conform with @windmillcode/angular-wml-components-base ,

v17.1.0000

updated package to reflect the version ^17.1.0 of @angular/core package,

v17.1.2

updated package to conform with @windmillcode/angular-wml-components-base ,

v17.1.1000

updated package to conform with @windmillcode/angular-wml-components-base ,

v17.1.2000 [2/5/24]

updated package to reflect the version ^17.1.2 of @angular/core package,

v17.1.2001 [2/8/24]

updated package to conform with @windmillcode/angular-wml-components-base ,

v17.1.3000 [2/8/24]

updated package to reflect the version ^17.1.3 of @angular/core package,

v17.2.1000 [2/17/24]

updated package to reflect the version ^17.2.1 of @angular/core package,

v17.2.2000 [2/23/24]

updated package to reflect the version ^17.2.2 of @angular/core package,

v17.2.2001 [2/23/24]

updated package to reflect the version ^17.2.2 of @angular/core package,

v17.2.3000 [2/28/24]

updated package to reflect the version ^17.2.3 of @angular/core package,

v17.2.3001 [3/2/24]

updated package to conform with @windmillcode/angular-wml-components-base ,

v17.2.3002 [3/5/24]

updated package to conform with @windmillcode/angular-wml-components-base ,

v17.2.4000 [3/8/24]

updated package to reflect the version ^17.2.4 of @angular/core package,

v17.2.4001 [3/12/24]

updated package to conform with @windmillcode/angular-wml-components-base ,

v17.2.4002 [3/12/24]

updated package to conform with @windmillcode/angular-wml-components-base ,

v17.2.4003 [3/13/24]

updated package to conform with @windmillcode/angular-wml-components-base ,

v17.2.4004 [3/13/24]

updated package to conform with @windmillcode/angular-wml-components-base ,

v17.3.0 [3/17/24]

updated package to reflect the version ^17.3.0 of @angular/core package ,

v17.3.1000 [3/22/24]

updated package to reflect the version ^17.3.1 of @angular/core package,

v17.3.2000 [3/28/24]

updated package to reflect the version ^17.3.2 of @angular/core package,

v17.3.3000 [4/4/24]

updated package to reflect the version ^17.3.3 of @angular/core package,

v17.3.4000 [4/11/24]

updated package to reflect the version ^17.3.4 of @angular/core package,

v17.3.4001 [4/16/24]

updated package to conform with @windmillcode/angular-wml-components-base ,

v17.3.5000 [4/20/24]

updated package to reflect the version ^17.3.5 of @angular/core package,

v17.3.5110 [5/1/24]

updated package to conform with @windmillcode/angular-wml-components-base ,

v17.3.6000 [5/1/24]

updated package to reflect the version ^17.3.6 of @angular/core package,

v17.3.7000 [5/9/24]

updated package to reflect the version ^17.3.7 of @angular/core package,

v17.3.8000 [5/9/24]

updated package to reflect the version ^17.3.8 of @angular/core package,

v17.3.9000 [5/16/24]

updated package to reflect the version ^17.3.9 of @angular/core package,

v18.0.1 [5/22/24]

updated package to reflect the version ^18.0.0 of @angular/core package,

v18.0.4 [5/25/24]

updated package to conform with @windmillcode/angular-wml-components-base ,

v18.0.1000 [5/29/24]

updated package to reflect the version ^18.0.1 of @angular/core package,

v18.0.2000 [6/6/24]

updated package to reflect the version ^18.0.2 of @angular/core package,

v18.0.3000 [6/13/24]

updated package to reflect the version ^18.0.3 of @angular/core package,

v18.0.3010 [6/18/24]

updated package to conform with @windmillcode/angular-wml-components-base ,

v18.0.4000 [6/23/24]

updated package to conform with @windmillcode/angular-wml-components-base ,

v18.0.5000 [6/26/24]

updated package to reflect the version ^18.0.5 of @angular/core package,

v18.0.6000 [7/5/24]

updated package to reflect the version ^18.0.6 of @angular/core package,

v18.1.4 [7/13/24]

updated package to reflect the version ^18.1.0 of @angular/core package,

v18.1.6 [7/14/24]

updated package to conform with @windmillcode/angular-wml-components-base ,

v18.1.1000 [7/18/24]

updated package to reflect the version ^18.1.1 of @angular/core package,

v18.1.2000 [7/24/24]

updated package to reflect the version ^18.1.2 of @angular/core package,

v18.1.2300 [7/27/24]

updated package to conform with @windmillcode/angular-wml-components-base ,

v18.1.2301 [7/30/24]

updated package to conform with @windmillcode/angular-wml-components-base ,

v18.1.3000-beta1 [8/1/24]

updated package to conform with @windmillcode/angular-wml-components-base ,

v18.1.3000-beta2 [8/1/24]

updated package to conform with @windmillcode/angular-wml-components-base ,

v18.1.3000-beta3 [8/1/24]

updated package to conform with @windmillcode/angular-wml-components-base ,

v18.1.3000-beta4 [8/1/24]

updated package to conform with @windmillcode/angular-wml-components-base

v18.1.3001 [8/4/24]

updated package to conform with @windmillcode/angular-wml-components-base

v18.1.3002 [8/4/24]

updated package to conform with @windmillcode/angular-wml-components-base

v18.1.3002 [8/5/24]

updated package to conform with @windmillcode/angular-wml-components-base

v18.1.3003 [8/5/24]

updated package to conform with @windmillcode/angular-wml-components-base

v18.1.3004 [8/5/24]

updated package to conform with @windmillcode/angular-wml-components-base

v18.1.3005 [8/5/24]

updated package to conform with @windmillcode/angular-wml-components-base

v18.1.3006 [8/5/24]

updated package to conform with @windmillcode/angular-wml-components-base

v18.1.3007 [8/5/24]

updated package to conform with @windmillcode/angular-wml-components-base

v18.1.4000 [8/14/24]

updated package to conform with @windmillcode/angular-wml-components-base

v18.1.4001 [8/14/24]

updated package to conform with @windmillcode/angular-wml-components-base

v18.2.0 [8/15/24]

updated package to conform with @windmillcode/angular-wml-components-base

v18.2.1 [8/20/24]

updated package to conform with @windmillcode/angular-wml-components-base

v18.2.2 [8/21/24]

[FIX] fixed bug with mobile nav child elements

v18.2.1000 [8/22/24]

updated package to reflect the version 18.2.1 of @angular/core package

v18.2.2000 [8/30/24]

updated package to reflect the version 18.2.2 of @angular/core package

v18.2.2100 [9/1/24]

updated package to conform with @windmillcode/angular-wml-components-base

v18.2.2101 [9/1/24]

updated package to conform with @windmillcode/angular-wml-components-base

v18.2.2200 [9/3/24]

updated package to conform with @windmillcode/angular-wml-components-base

v18.2.3000 [9/4/24]

updated package to reflect the version 18.2.3 of @angular/core package

v18.2.3100 [9/8/24]

updated package to reflect the version 18.2.3 of @angular/core package

v18.2.3110 [9/10/24]

updated package to conform with @windmillcode/angular-wml-components-base

v18.2.3112 [9/10/24]

updated package to conform with @windmillcode/angular-wml-components-base

v18.2.4000 [9/16/24]

updated package to reflect the version 18.2.4 of @angular/core package

v18.2.4100 [9/19/24]

updated package to conform with @windmillcode/wml-components-base

v18.2.4200 [9/21/24]

updated package to conform with @windmillcode/wml-components-base

v18.2.5001 [9/22/24]

updated package to reflect the version 18.2.5 of @angular/core package

v18.2.6000 [10/1/24]

updated package to reflect the version 18.2.6 of @angular/core package

v18.2.7000 [10/2/24]

updated package to reflect the version 18.2.7 of @angular/core package

v18.2.7001 [10/5/24]

updated package to conform with @windmillcode/wml-components-base

v18.2.7010 [10/9/24]

updated package to conform with @windmillcode/wml-components-base

v18.2.7020 [10/10/24]

updated package to conform with @windmillcode/wml-components-base

v18.2.8000 [10/10/24]

updated package to reflect the version 18.2.8 of @angular/core package

v18.2.8000 [10/11/24]

updated package to reflect the version 18.2.8 of @angular/core package

v18.2.8001 [10/11/24]

updated package to conform with @windmillcode/wml-components-base

v18.2.9000 [10/23/24]

updated package to conform with @windmillcode/wml-components-base

v18.2.10000 [10/31/24]

updated package to conform with @windmillcode/wml-components-base

v18.2.11000 [11/7/24]

updated package to conform with @windmillcode/wml-components-base

v18.2.12000 [11/15/24]

updated package to conform with @windmillcode/wml-components-base

v18.2.12001 [11/17/24]

updated package to conform with @windmillcode/wml-components-base

v19.0.0 [11/19/24]

updated package to conform with @windmillcode/wml-components-base

v19.0.3 [11/20/24]

updated package to conform with @windmillcode/wml-components-base

v19.0.4 [11/26/24]

updated package to conform with @windmillcode/wml-components-base

v19.0.1000 [11/26/24]

updated package to conform with @windmillcode/wml-components-base

v19.0.2000 [12/4/24]

updated package to reflect the version 19.0.2 of @angular/core package

v19.0.3000 [12/6/24]

updated package to reflect the version 19.0.3 of @angular/core package

v19.0.4000 [12/12/24]

updated package to reflect the version 19.0.4 of @angular/core package

v19.0.5000 [12/19/24]

updated package to reflect the version 19.0.5 of @angular/core package

v19.0.5100 [12/29/24]

updated package to conform with @windmillcode/wml-components-base

v19.0.6000 [1/12/25]

updated package to reflect the version 19.0.6 of @angular/core package

v19.0.7000 [1/16/25]

updated package to reflect the version 19.0.7 of @angular/core package

v19.1.0 [1/17/25]

updated package to reflect the version 19.1.0 of @angular/core package

v19.1.1000 [1/17/25]

updated package to reflect the version 19.1.1 of @angular/core package

v19.1.2000 [1/23/25]

updated package to reflect the version 19.1.2 of @angular/core package

v19.1.3000 [1/23/25]

updated package to reflect the version 19.1.3 of @angular/core package

v19.1.3100 [1/23/25]

update package to support the react native ecosystem

v19.1.3111 [1/27/25]

updated package to conform with @windmillcode/wml-components-base

v19.1.3112 [1/28/25]

updated package to conform with @windmillcode/wml-components-base

v19.1.4000 [1/31/25]

updated package to reflect the version 19.1.4 of @angular/core package

v19.1.5000 [2/8/25]

updated package to reflect the version 19.1.5 of @angular/core package

v19.1.6000 [2/13/25]

updated package to reflect the version 19.1.6 of @angular/core package

v19.1.7000 [2/21/25]

updated package to reflect the version 19.1.7 of @angular/core package

v19.1.8000 [3/4/25]

updated package to reflect the version 19.1.8 of @angular/core package

v19.2.0 [3/4/25]

updated package to reflect the version 19.2.0 of @angular/core package

v19.2.1000 [3/9/25]

updated package to reflect the version 19.2.1 of @angular/core package

v19.2.2000 [3/15/25]

updated package to reflect the version 19.2.2 of @angular/core package

v19.2.3000 [3/21/25]

updated package to reflect the version 19.2.3 of @angular/core package

v19.2.4000 [3/27/25]

updated package to reflect the version 19.2.4 of @angular/core package

v19.2.5000 [4/3/25]

updated package to reflect the version 19.2.5 of @angular/core package

v19.2.5001 [4/6/25]

updated package to conform with @windmillcode/wml-components-base

v19.2.5100 [4/10/25]

updated package to conform with @windmillcode/wml-components-base

v19.2.6000 [4/10/25]

updated package to conform with @windmillcode/wml-components-base

WML Mobile Nav

Installation

Usage

WMLMobileNavZero

Getting Started

Adding A Logo Header

Decent Example

Reference

WMLMobileNavZeroProps

Changelog

v0.0.1

v0.0.2

v1.0.4

v16.2.4-0

v16.2.4-1

v16.2.5-0

v16.2.80

v16.2.80

v16.2.90

v16.2.91

v16.2.93

v16.2.100

v16.2.110

v16.2.120

v17.0.10

v17.0.11

v17.0.20

v17.0.40

v17.0.50

v17.0.60

v17.0.70

v17.0.7100

v17.0.7200

v17.0.7300

v17.0.80

v17.0.8100

v17.0.8102

v17.0.8103

v17.0.9000

v17.0.9001

v17.1.0000

v17.1.2

v17.1.1000

v17.1.2000 [2/5/24]

v17.1.2001 [2/8/24]

v17.1.3000 [2/8/24]

v17.2.1000 [2/17/24]

v17.2.2000 [2/23/24]

v17.2.2001 [2/23/24]

v17.2.3000 [2/28/24]

v17.2.3001 [3/2/24]

v17.2.3002 [3/5/24]

v17.2.4000 [3/8/24]

v17.2.4001 [3/12/24]

v17.2.4002 [3/12/24]

v17.2.4003 [3/13/24]

v17.2.4004 [3/13/24]

v17.3.0 [3/17/24]

v17.3.1000 [3/22/24]

v17.3.2000 [3/28/24]

v17.3.3000 [4/4/24]

v17.3.4000 [4/11/24]

v17.3.4001 [4/16/24]

v17.3.5000 [4/20/24]

v17.3.5110 [5/1/24]

v17.3.6000 [5/1/24]

v17.3.7000 [5/9/24]

v17.3.8000 [5/9/24]

v17.3.9000 [5/16/24]

v18.0.1 [5/22/24]

v18.0.4 [5/25/24]

v18.0.1000 [5/29/24]

v18.0.2000 [6/6/24]

v18.0.3000 [6/13/24]

v18.0.3010 [6/18/24]

v18.0.4000 [6/23/24]

v18.0.5000 [6/26/24]

v18.0.6000 [7/5/24]

v18.1.4 [7/13/24]

v18.1.6 [7/14/24]