@acoustic-content-sdk/ng-utils

Implementation of a utility methods and classes for Angular based projects.

Usage no npm install needed!

<script type="module">
  import acousticContentSdkNgUtils from 'https://cdn.skypack.dev/@acoustic-content-sdk/ng-utils';
</script>

README

npm

Implementation of a utility methods and classes for Angular based projects.

Table of Contents

Home > @acoustic-content-sdk/ng-utils

ng-utils package

Implementation of a utility methods and classes for Angular based projects

Classes

Class Description
AbstractBaseComponent Implementation of a base component for Angular Components that expose the renderingContext and layoutMode output observables.
AbstractLifeCycleComponent tslint:disable:no-conflicting-lifecycle
AbstractRenderingComponent Convenience base class for components that work with a RenderingContextV2.
AcNgBrowserWindowModule Exposes the window as the ACOUSTIC_TOKEN_WINDOW token for the case that the application runs in the browser (as opposed to running on the server via Angular Universal)
AcNgEditHostWindowModule Exposes the edit host as the ACOUSTIC_TOKEN_EDIT_HOST_WINDOW token.Depends on: ACOUSTIC_TOKEN_WINDOW

Functions

Function Description
proxyGetEditHostWindow(aCurrentWindow) Returns the window that controls the application

Variables

Variable Description
VERSION Version and build number of the package

Home > @acoustic-content-sdk/ng-utils > AbstractBaseComponent

AbstractBaseComponent class

Implementation of a base component for Angular Components that expose the renderingContext and layoutMode output observables.

Signature:

export declare abstract class AbstractBaseComponent extends AbstractLifeCycleComponent implements RenderingContextProviderV2 

Constructors

Constructor Modifiers Description
(constructor)() Constructs a new instance of the AbstractBaseComponent class

Properties

Property Modifiers Type Description
layoutMode string Set the layout mode to render this page
layoutMode$ Observable<string> Fires whenever the layout mode changed, includes the initial default mode.
renderingContext$ Observable<RenderingContextV2> The rendering context for the page. This is the context of the element that is referenced by the currently active route.

Home > @acoustic-content-sdk/ng-utils > AbstractLifeCycleComponent

AbstractLifeCycleComponent class

tslint:disable:no-conflicting-lifecycle

Signature:

export declare abstract class AbstractLifeCycleComponent implements OnInit, OnDestroy, OnChanges, DoCheck, AfterContentInit, AfterContentChecked, AfterViewInit, AfterViewChecked 

Properties

Property Modifiers Type Description
afterContentChecked$ Observable<void> AfterContentChecked
afterContentInit$ Observable<void> AfterContentInit
afterViewChecked$ Observable<void> AfterViewChecked
afterViewInit$ Observable<void> AfterViewInit
doCheck$ Observable<void> DoCheck
onChanges$ Observable<SimpleChanges> OnChanges
onDestroy$ Observable<void> OnDestroy
onInit$ Observable<void> OnInit

Methods

Method Modifiers Description
ngAfterContentChecked() AfterContentChecked
ngAfterContentInit() AfterContentInit
ngAfterViewChecked() AfterViewChecked
ngAfterViewInit() AfterViewInit
ngDoCheck() DoCheck
ngOnChanges(changes) OnChanges
ngOnDestroy() OnDestroy
ngOnInit() {@linkhttps://angular.io/guide/lifecycle-hooks| OnInit}

Home > @acoustic-content-sdk/ng-utils > AbstractRenderingComponent

AbstractRenderingComponent class

Convenience base class for components that work with a RenderingContextV2.

Signature:

export declare abstract class AbstractRenderingComponent extends AbstractBaseComponent implements RenderingContextProviderV2 

Constructors

Constructor Modifiers Description
(constructor)() Our constructor

Properties

Property Modifiers Type Description
layoutMode$ Observable<string> Returns an Observable for the layout mode
renderingContext$ Observable<RenderingContextV2> Returns an Observable for the rendering context

Methods

Method Modifiers Description
trackCtx(aIndex, aCtx) Generates unique IDs for elements using the following strategy: - if the context is a string, use it as the ID - if the context is an element then ... -- if the element contains an 'id' field, use that -- if the element has a '$metadata.id' field, use that -- if the element has a '$metadata.accessor' field, use that -- fall back to the index

Home > @acoustic-content-sdk/ng-utils > AcNgBrowserWindowModule

AcNgBrowserWindowModule class

Exposes the window as the ACOUSTIC_TOKEN_WINDOW token for the case that the application runs in the browser (as opposed to running on the server via Angular Universal)

Signature:

export declare class AcNgBrowserWindowModule 

Home > @acoustic-content-sdk/ng-utils > AcNgEditHostWindowModule

AcNgEditHostWindowModule class

Exposes the edit host as the ACOUSTIC_TOKEN_EDIT_HOST_WINDOW token.

Depends on: ACOUSTIC_TOKEN_WINDOW

Signature:

export declare class AcNgEditHostWindowModule 

Home > @acoustic-content-sdk/ng-utils > proxyGetEditHostWindow

proxyGetEditHostWindow() function

Returns the window that controls the application

Signature:

export declare function proxyGetEditHostWindow(aCurrentWindow: WindowType): WindowType;

Parameters

Parameter Type Description
aCurrentWindow WindowType the current window

Returns:

WindowType

the controlling window

Home > @acoustic-content-sdk/ng-utils > VERSION

VERSION variable

Version and build number of the package

Signature:

VERSION: {
    version: {
        major: string;
        minor: string;
        patch: string;
        branch: string;
    };
    build: Date;
}

Home > @acoustic-content-sdk/ng-utils > AbstractBaseComponent > (constructor)

AbstractBaseComponent.(constructor)

Constructs a new instance of the AbstractBaseComponent class

Signature:

protected constructor();

Home > @acoustic-content-sdk/ng-utils > AbstractBaseComponent > layoutMode

AbstractBaseComponent.layoutMode property

Set the layout mode to render this page

Signature:

layoutMode: string;

Home > @acoustic-content-sdk/ng-utils > AbstractBaseComponent > layoutMode$

AbstractBaseComponent.layoutMode$ property

Fires whenever the layout mode changed, includes the initial default mode.

Signature:

readonly layoutMode$: Observable<string>;

Home > @acoustic-content-sdk/ng-utils > AbstractBaseComponent > renderingContext$

AbstractBaseComponent.renderingContext$ property

The rendering context for the page. This is the context of the element that is referenced by the currently active route.

Signature:

renderingContext$: Observable<RenderingContextV2>;

Home > @acoustic-content-sdk/ng-utils > AbstractRenderingComponent > (constructor)

AbstractRenderingComponent.(constructor)

Our constructor

Signature:

constructor();

Home > @acoustic-content-sdk/ng-utils > AbstractRenderingComponent > layoutMode$

AbstractRenderingComponent.layoutMode$ property

Returns an Observable for the layout mode

Signature:

readonly layoutMode$: Observable<string>;

Home > @acoustic-content-sdk/ng-utils > AbstractRenderingComponent > renderingContext$

AbstractRenderingComponent.renderingContext$ property

Returns an Observable for the rendering context

Signature:

readonly renderingContext$: Observable<RenderingContextV2>;

Home > @acoustic-content-sdk/ng-utils > AbstractRenderingComponent > trackCtx

AbstractRenderingComponent.trackCtx() method

Generates unique IDs for elements using the following strategy: - if the context is a string, use it as the ID - if the context is an element then ... -- if the element contains an 'id' field, use that -- if the element has a '$metadata.id' field, use that -- if the element has a '$metadata.accessor' field, use that -- fall back to the index

Signature:

trackCtx(aIndex: number, aCtx: RenderingContextInput): string | number;

Parameters

Parameter Type Description
aIndex number index of the iteration
aCtx RenderingContextInput the input

Returns:

string | number

the unique ID

Home > @acoustic-content-sdk/ng-utils > AbstractLifeCycleComponent > afterContentChecked$

AbstractLifeCycleComponent.afterContentChecked$ property

AfterContentChecked

Signature:

protected get afterContentChecked$(): Observable<void>;

Home > @acoustic-content-sdk/ng-utils > AbstractLifeCycleComponent > afterContentInit$

AbstractLifeCycleComponent.afterContentInit$ property

AfterContentInit

Signature:

protected get afterContentInit$(): Observable<void>;

Home > @acoustic-content-sdk/ng-utils > AbstractLifeCycleComponent > afterViewChecked$

AbstractLifeCycleComponent.afterViewChecked$ property

AfterViewChecked

Signature:

protected get afterViewChecked$(): Observable<void>;

Home > @acoustic-content-sdk/ng-utils > AbstractLifeCycleComponent > afterViewInit$

AbstractLifeCycleComponent.afterViewInit$ property

AfterViewInit

Signature:

protected get afterViewInit$(): Observable<void>;

Home > @acoustic-content-sdk/ng-utils > AbstractLifeCycleComponent > doCheck$

AbstractLifeCycleComponent.doCheck$ property

DoCheck

Signature:

protected get doCheck$(): Observable<void>;

Home > @acoustic-content-sdk/ng-utils > AbstractLifeCycleComponent > onChanges$

AbstractLifeCycleComponent.onChanges$ property

OnChanges

Signature:

protected get onChanges$(): Observable<SimpleChanges>;

Home > @acoustic-content-sdk/ng-utils > AbstractLifeCycleComponent > onDestroy$

AbstractLifeCycleComponent.onDestroy$ property

OnDestroy

Signature:

protected get onDestroy$(): Observable<void>;

Home > @acoustic-content-sdk/ng-utils > AbstractLifeCycleComponent > onInit$

AbstractLifeCycleComponent.onInit$ property

OnInit

Signature:

protected get onInit$(): Observable<void>;

Home > @acoustic-content-sdk/ng-utils > AbstractLifeCycleComponent > ngAfterContentChecked

AbstractLifeCycleComponent.ngAfterContentChecked() method

AfterContentChecked

Signature:

ngAfterContentChecked(): void;

Returns:

void

Home > @acoustic-content-sdk/ng-utils > AbstractLifeCycleComponent > ngAfterContentInit

AbstractLifeCycleComponent.ngAfterContentInit() method

AfterContentInit

Signature:

ngAfterContentInit(): void;

Returns:

void

Home > @acoustic-content-sdk/ng-utils > AbstractLifeCycleComponent > ngAfterViewChecked

AbstractLifeCycleComponent.ngAfterViewChecked() method

AfterViewChecked

Signature:

ngAfterViewChecked(): void;

Returns:

void

Home > @acoustic-content-sdk/ng-utils > AbstractLifeCycleComponent > ngAfterViewInit

AbstractLifeCycleComponent.ngAfterViewInit() method

AfterViewInit

Signature:

ngAfterViewInit(): void;

Returns:

void

Home > @acoustic-content-sdk/ng-utils > AbstractLifeCycleComponent > ngDoCheck

AbstractLifeCycleComponent.ngDoCheck() method

DoCheck

Signature:

ngDoCheck(): void;

Returns:

void

Home > @acoustic-content-sdk/ng-utils > AbstractLifeCycleComponent > ngOnChanges

AbstractLifeCycleComponent.ngOnChanges() method

OnChanges

Signature:

ngOnChanges(changes: SimpleChanges): void;

Parameters

Parameter Type Description
changes SimpleChanges

Returns:

void

Home > @acoustic-content-sdk/ng-utils > AbstractLifeCycleComponent > ngOnDestroy

AbstractLifeCycleComponent.ngOnDestroy() method

OnDestroy

Signature:

ngOnDestroy(): void;

Returns:

void

Home > @acoustic-content-sdk/ng-utils > AbstractLifeCycleComponent > ngOnInit

AbstractLifeCycleComponent.ngOnInit() method

{@linkhttps://angular.io/guide/lifecycle-hooks| OnInit}

Signature:

ngOnInit(): void;

Returns:

void