ibm-wch-sdk-ng
v5.0.361
Published
Software development kit to simplify the development of Angular based single page applications against Watson Content Hub.
Downloads
17
Readme
IBM Angular SDK for Watston Content Hub
This module represents a software development kit (SDK) that can be used by Angular 4 based applications to build single page applications (SPA) against Watson Content Hub (WCH) managed pages.
Changes
Usage
npm install --save ibm-wch-sdk-ng
Class documentation
Refer to the documentation.
Components
The SDK defines one top level module module for use in the application component.
imports: [
...
WchNgModule.forRoot({ apiUrl: new URL(apiUrl), deliveryUrl: new URL(deliveryUrl) })
...
]
First steps
Building an application for WCH involves a client side and a server side step. During the server side step you create your content in WCH. During the client side step you build your Angular 4 application that consumers the content.
Prerequisites
- Install a node environment with Node >= 4 and NPM >= 3.
- Make sure you have a text editor installed. For editing Typescript we recommend Visual Studio Code, consider installing also these extensions.
Server Side
Please refer to the Server Side Setup instructions.
Client Side
First install angular-cli using
npm install -g @angular/cli
Bootstrap your angular application
ng new PROJECT-NAME
cd PROJECT-NAME
Install the WCH SDK and its peer dependencies:
npm install --save ibm-wch-sdk-ng
Create angular components for the layouts defined during the server setup.
ng g component layouts/MY_COMPONENT
Add a layout selector to your component. The selector creates the connection between the layout identifier and the angular component. In addition it is convenient (but not required) to subclass your new component from AbstractRenderingComponent. Make the following changes to the MY_COMPONENT.ts
file created in the step before:
import { LayoutComponent, AbstractRenderingComponent } from 'ibm-wch-sdk-ng';
@LayoutComponent({
selector: ['MY_COMPONENT_SELECTOR']
})
@Component({
...
})
export class MyComponent extends AbstractRenderingComponent {
constructor() {
super();
}
}
Make sure to add your new layout to the set of entry components of the main module, because the component will be instantiated dynamically:
@NgModule({
...
entryComponents: [MyComponent, ...],
...
})
export class AppModule {
}
You will typically run your application in local development mode, first. Configure it to use the WCH server and tenant of your choice as the backend service. Do this by adding the configured WchModule to the main application module. A convenient way to configure this module is via the environment
config file. The CLI will automatically select the correct file depending on your development environment (e.g. dev
vs. production
).
import { WchModule } from 'ibm-wch-sdk-ng';
import { environment } from '../environments/environment';
...
@NgModule({
...
imports: [
...
WchNgModule.forRoot(environment)
...
]
})
export class AppModule {
}
The content of the environment file for local development might look like this:
const HOSTNAME = 'dch-dxcloud.rtp.raleigh.ibm.com';
const TENANT_ID = '7576818c-ca11-4b86-b03d-333313c4f0ad';
export const apiUrl = `http://${HOSTNAME}/api/${TENANT_ID}`;
export const deliveryUrl = `http://${HOSTNAME}/${TENANT_ID}`;
export const environment = {
production: false,
apiUrl: new URL(apiUrl),
deliveryUrl: new URL(deliveryUrl)
};
In a last step you'll add routing to the application. The easiest way is to configure all routes to be served by WCH pages. For this create the following router config and add it to your main application module:
import { PageComponent } from 'ibm-wch-sdk-ng';
...
import { RouterModule, Routes } from '@angular/router';
...
const appRoutes: Routes = [
{
path: '',
redirectTo: '/home',
pathMatch: 'full'
},
{
path: '**',
component: PageComponent
}
];
@NgModule({
...
imports: [
RouterModule.forRoot(appRoutes),
...
]
})
export class AppModule {
}
Start your local development server and enjoy:
ng serve
Note
Using the development version of the NPM registry
Add the file .npmrc
to your application folder:
registry = http://wats-repob.devlab.ibm.com
@request:registry=https://registry.npmjs.org/
@types:registry=https://registry.npmjs.org/
@angular:registry=https://registry.npmjs.org/
@ngtools:registry=https://registry.npmjs.org/
Changelog
Current
5.0.107 - 2018-02-28
Breaking Changes
- Renamed
ContentWithLayout
toContentItemWithLayout
.
Changed
- Split the module into the API module
ibm-wch-sdk-api
and the implementation moduleibm-wch-sdk-ng
. No breaking change expected, since the API is re-exported by the implementation module. I recommend however to reference the exports from the API module rather than those from the implementation module.
1.0.830 - 2018-01-16
Added
- New
SearchService
- New
luceneEscapeTerm
andluceneEscapeKeyValue
methods to simplify the generation of search queries - Support for
optionselection
elements
Changed
- Updated HTTP transport layer from deprecated Http to HttpClient. Requires minimum angular dependency of
4.3.0
.
1.0.771 - 2018-01-16
Added
- New
WchLoggerService
- New
WchInfoService
- Adding
describeSetter
in 'AbstractLifeCycleComponent' - Basic support for new
[wchEditable]
directive - Support for
levels
parameter inwch-contentref
Fixed
- Compatibility to Angular 5
ibm-wch-sdk-ng
Index
External modules
- "components/content/content.component"
- "components/contentquery/contentquery.component"
- "components/contentref/contentref.component"
- "components/default/default.component"
- "components/page/page.component"
- "components/pageref/pageref.component"
- "components/path/content.path.component"
- "components/rendering/abstract-base.component"
- "components/rendering/abstract-rendering.component"
- "components/rendering/abstract.lifecycle.component"
- "components/site/site.component"
- "decorators/bootstrap/rendering.context.bootstrap.decorator"
- "decorators/bootstrap/rendering.context.bootstrap.directive"
- "decorators/bootstrap/site.bootstrap.decorator"
- "decorators/bootstrap/site.bootstrap.directive"
- "decorators/layout/layout.decorator"
- "decorators/layout/layout.directive"
- "directives/contentref.directive"
- "index"
- "interfaces"
- "interfaces/hub-context"
- "internal/assert"
- "module"
- "modules/components.module"
- "modules/services.module"
- "services/bootstrap/bootstrap.service"
- "services/components/components.service"
- "services/config/application.config"
- "services/config/application.config.service"
- "services/config/empty.application.config"
- "services/dependency/dependency.service"
- "services/dependency/message"
- "services/dependency/message/sdk.navigate.by.path.message"
- "services/dependency/message/sdk.refresh.message"
- "services/dependency/message/sdk.set.mode.message"
- "services/dependency/message/sdk.subscribe.active.route.message"
- "services/dependency/message/sdk.subscribe.message"
- "services/dependency/message/sdk.subscribe.mode.message"
- "services/dependency/message/sdk.subscribe.route.message"
- "services/dependency/sdk/jsonp/jsonp"
- "services/dependency/sdk/router/router"
- "services/dependency/sdk/sdk"
- "services/dependency/sdk/search/search"
- "services/dependency/sdk/version"
- "services/http/http.service"
- "services/http/http.service.on.http.client"
- "services/http/http.service.on.jsonp"
- "services/hub-info/hub-info.service"
- "services/info/wch.info.service"
- "services/injection/injection.service"
- "services/logger/logger.service"
- "services/logger/wch.logger.service"
- "services/mappings/mappings.service"
- "services/markup/markup.service"
- "services/page/active.page.service"
- "services/refresh/refresh.service"
- "services/search/search.service"
- "services/storage/storage.service"
- "services/url/urls.service"
- "services/wch.service"
- "services/zone/zone.service"
- "utils/bootstrap.utils"
- "utils/component.mapping.utils"
- "utils/component.utils"
- "utils/http.service"
- "utils/http.service.on.http"
- "utils/http.service.on.http.client"
- "utils/http.service.on.jsonp"
- "utils/js.utils"
- "utils/markup.utils"
- "utils/ng.utils"
- "utils/page.utils"
- "utils/perf.utils"
- "utils/reflect.utils"
- "utils/rx.utils"
- "utils/site.utils"
- "utils/url.utils"
- "utils/url.utils.ifaces"
- "utils/urls"
- "utils/wch.utils"
- "version"
WchNgModule
The main SDK module exposes the components and services to be used by the application. Have a look at development stories for an explanation of usecases.
Usage
imports: [
...
WchNgModule.forRoot({ apiUrl: new URL(apiUrl), deliveryUrl: new URL(deliveryUrl) })
...
]
Add the module to your main application module using the forRoot
accessor method. The context passed to the accessor defines the entry URLs into WCH.
Tipps
For your convenience you can also keep the URLs as part of the environment
properties. In this case pass the environment directly to the forRoot
method and declare the urls as part of the environment object, e.g.
import { environment } from '../environments/environment';
...
imports: [
...
WchNgModule.forRoot(environment)
],
with an environment properties file like this:
export const environment = {
production: false,
apiUrl: new URL(apiUrl),
deliveryUrl: new URL(deliveryUrl)
};
Developing modules based on the SDK
When developing modules that use the SDK, make sure to import the WchNgComponentsModule to have access to the components and directives exposed by the SDK.
LayoutDecorator
The layout decorator allow to assign a layout name to a component.
Usage
@LayoutComponent({
selector: 'one-column'
})
@Component({
selector: 'app-one-column',
...
})
export class OneColumnComponent extends AbstractRenderingComponent implements OnInit, OnDestroy {
or
@LayoutComponent()
@Component({
selector: 'app-one-column',
...
})
export class OneColumnComponent extends AbstractRenderingComponent implements OnInit, OnDestroy {
Properties
selector
: the name of the layout. This matches the controller field in the layout descriptor. If this property is missing, then the selector of the component will be used as a fallback. The type of this field can bestring
orstring[]
. In the array form, all selectors in the array will be associated with the component.mappingId?
: the optional mapping ID defines a fallback layout mapping, if no layout could be determined via WCH configuration. The ID carries either a content ID, a type ID or a type name.layoutMode?
: the optional layout mode defines the mode that the fallback mapping applies to.
Note
You can leave out the selector property on the LayoutComponent
decorator. In this case the selector of the Component
will be used as the name of the layout.
LayoutMappingDecorator
The layout mapping decorator allows to register fallback layout mappings as decorations of a class.
Parameters
id
: defines a fallback layout mapping, if no layout could be determined via WCH configuration. The ID carries either a content ID, a type ID or a type name.selector
: the selector of the layout, either a string or a type. If the selector is missing, we use the attached classlayoutMode?
: the optional layout mode defines the mode that the fallback mapping applies to.
Usage
The following example maps an ID of a content item to the HeroGridComponent
layout in the default layout mode:
@LayoutMapping('e2ab99d1-9f9c-49a3-a80e-ec45c7748820', HeroGridComponent)
class ...
RenderingContextBinding
The context binding allows to attach a property of the rendering context to an instance variable of the component. This will often improve the readability of the template.
Usage
@LayoutComponent(...)
@Component(...)
export class OneColumnComponent extends AbstractRenderingComponent {
@RenderingContextBinding('elements.text.value', 'defaultValue')
textValue: string;
}
Properties
selector
: the selector is a simple dot notation expresssion for the desired property, relative to the rendering context. Note that this does NOT support array expressions (yet). Optionally you may also pass a function that takes a rendering context as input and returns the desired value.default
: an optional default value that will be used if the rendering context does not contain the element
Note
The binding assumes the existence of a onRenderingContext
observable on the class. This is automatically the case if the class inherits from AbstractRenderingComponent.
AbstractRenderingComponent
Component that can be used as a super class for custom components such as layouts. The component exposes a setter for the RenderingContext in a format that is expected by the ContentrefComponent.
Attributes
renderingContext
: the current rendering contextlayoutMode
: the current layout mode
Methods
trackByComponentId
: method to be used with the *ngFor directive when iterating over RenderingContext references. The method returns the ID of the rendering context, allowing Angular to correlate updates of the list.
Events
onRenderingContext
: fires when the rendering context changesonLayoutMode
: fires when the layout mode changes
Both the onRenderingContext
and the onLayoutMode
observables will complete when the component is destroyed (i.e. in the course of processing the ngOnDestroy method). This implies that subscribers attached to theses observables do NOT need to unsubscribe explicitly, if they wish their subscription to last for the duration of the lifetime of the component (see section Subscribing and Unsubscribing in the observable contract).
AbstractLifeCycleComponent
Component that offers observables that will be fired when one of the lifecycle methods is invoked. This can be used as an alternative to override the respective method on the class. The mechanism is useful because:
- the observables can already be accessed in the constructor of the components and can reference variables in the private closure of the constructor
- it is a common pattern to setup observable chains in the constructor and to subscribe to them to keep application state up-to-date. These subscriptions however must be unsubscribed on in the
ngOnDestroy
method to avoid memory leaks. Using a life cycle callback this can be easily done inside the constructor.
Methods
ngXXX
: the original life cycle method exposed by Angular. Subclasses that want to override these methods MUST call the super method.onXXX
: getter for an observable for this lifecycle method.unsubscribeOnDestroy(subscription)
: registers a subscription to be unsubscribed for inngOnDestroy
safeSubscribe(observable, handler)
: subscribes to an observable and registers the resulting subscription withngOnDestroy
. This is the most convenient way to handle subscriptions.
PageComponent
The page component resolves the current route to the component (or page) that is associated to this route in WCH. It can therefore be considered a proxy component that decouples the application at build time from the runtime artifacts.
Usage
The component does not require any specific configuration, it attaches itself to the routing logic via dependency injection.
Usage in HTML:
<wch-page></wch-page>
Usage in the router config:
const appRoutes: Routes = [
{
path: '**',
component: PageComponent
}
];
Attributes
layoutMode
: optionally pass the layout mode to be used when rendering the page. If not specified, the system uses the default mode.
Events
onRenderingContext
: the rendering context for the page as soon as it has been loadedonLayoutMode
: the layout mode used to render this page.
Error handling
If the page cannot be decoded, the system will look for a component mapped to the PAGE_NOT_FOUND_LAYOUT layout and instantiates this with an empty rendering context.
WCH Dependency
The page component uses the URL Slug
managed in WCH with each page to decode the targeted page. The URL slugs form a hierarchical namespace that matches the URL namespace of the SPA. The component uses the url
property of the ActivatedRoute. This property represents the sequence of path segments that will be matched against the defined URL slugs. The component will NOT interpret the parent router, so the SPA can decide to mount the WCH namespace at any location within its own namespace.
ibm-wch-sdk-ng > "components/content/content.component"
External module: "components/content/content.component"
Index
Classes
Variables
Variables
<Const>
LOGGER
● LOGGER: "ContentComponent" = "ContentComponent"
Defined in components/content/content.component.ts:28
ibm-wch-sdk-ng > "components/contentquery/contentquery.component"
External module: "components/contentquery/contentquery.component"
Index
Classes
Variables
Variables
<Const>
LOGGER
● LOGGER: "ContentQueryComponent" = "ContentQueryComponent"
Defined in components/contentquery/contentquery.component.ts:31
ibm-wch-sdk-ng > "components/contentref/contentref.component"
External module: "components/contentref/contentref.component"
Index
Classes
Interfaces
Variables
Functions
Object literals
Variables
<Const>
EMPTY_COMPONENT_OUTPUT
● EMPTY_COMPONENT_OUTPUT: Observable
<ComponentOutput> = empty()
Defined in components/contentref/contentref.component.ts:90
<Const>
KEY_ON_COMPONENT_OUTPUT
● KEY_ON_COMPONENT_OUTPUT: "onComponentOutput" = "onComponentOutput"
Defined in components/contentref/contentref.component.ts:56
<Const>
LOGGER
● LOGGER: "ContentrefComponent" = "ContentrefComponent"
Defined in components/contentref/contentref.component.ts:51
<Const>
opComponentInstance
● opComponentInstance: function
= typedPluck<ComponentRef, any>('instance')
Defined in components/contentref/contentref.component.ts:210
Operator to extract the component instance from a component ref
Type declaration
▸(source: Observable
<T
>): Observable
<T[K]
>
Parameters:
| Param | Type |
| ------ | ------ |
| source | Observable
<T
> |
Returns: Observable
<T[K]
>
Functions
_getComponentFactoryResolver
▸ _getComponentFactoryResolver(aConfig?: Route
): ComponentFactoryResolver
Defined in components/contentref/contentref.component.ts:212
Parameters:
| Param | Type |
| ------ | ------ |
| Optional
aConfig | Route
|
Returns: ComponentFactoryResolver
_mergeOutputs
▸ _mergeOutputs(aLayoutMode: string
, aRenderingContext: RenderingContext
, aComponentRef: ComponentRef
<any
>, aComponentFactory: ComponentFactory
<any
>): Observable
<ComponentOutput>
Defined in components/contentref/contentref.component.ts:102
Parameters:
| Param | Type |
| ------ | ------ |
| aLayoutMode | string
|
| aRenderingContext | RenderingContext
|
| aComponentRef | ComponentRef
<any
> |
| aComponentFactory | ComponentFactory
<any
> |
Returns: Observable
<ComponentOutput>
getType
▸ getType(aId: string
, aLayoutMode: * string
| undefined
*, aRenderingContext: RenderingContext
, aCmp: ComponentsService, aMapping: LayoutMappingService): Observable
<Type
<any
>>
Defined in components/contentref/contentref.component.ts:162
Parameters:
| Param | Type |
| ------ | ------ |
| aId | string
|
| aLayoutMode | string
| undefined
|
| aRenderingContext | RenderingContext
|
| aCmp | ComponentsService |
| aMapping | LayoutMappingService |
Returns: Observable
<Type
<any
>>
updateContext
▸ updateContext(aLayoutMode: string
, aRenderingContext: RenderingContext
, aComponentRef: ComponentRef
<any
>): void
Defined in components/contentref/contentref.component.ts:186
Parameters:
| Param | Type |
| ------ | ------ |
| aLayoutMode | string
|
| aRenderingContext | RenderingContext
|
| aComponentRef | ComponentRef
<any
> |
Returns: void
Object literals
<Const>
LAYOUT_NOT_FOUND_LAYOUT
LAYOUT_NOT_FOUND_LAYOUT: object
Defined in components/contentref/contentref.component.ts:54
template
● template: string
= ComponentsService.DEFAULT_LAYOUT
Defined in components/contentref/contentref.component.ts:54
templateType
● templateType: string
= LAYOUT_TYPE_ANGULAR
Defined in components/contentref/contentref.component.ts:54
<Const>
PAGE_NOT_FOUND_LAYOUT
PAGE_NOT_FOUND_LAYOUT: object
Defined in components/contentref/contentref.component.ts:53
template
● template: string
= ComponentsService.PAGE_NOT_FOUND_LAYOUT
Defined in components/contentref/contentref.component.ts:53
templateType
● templateType: string
= LAYOUT_TYPE_ANGULAR
Defined in components/contentref/contentref.component.ts:53
ibm-wch-sdk-ng > "components/default/default.component"
External module: "components/default/default.component"
Index
Classes
ibm-wch-sdk-ng > "components/page/page.component"
External module: "components/page/page.component"
Index
Classes
Variables
Functions
Variables
<Const>
LOGGER
● LOGGER: "PageComponent" = "PageComponent"
Defined in components/page/page.component.ts:17
<Const>
_EMPTY_VALUE
● _EMPTY_VALUE: ""
= ""
Defined in components/page/page.component.ts:21
<Const>
_META_NAME_DESCRIPTION
● _META_NAME_DESCRIPTION: "description" = "description"
Defined in components/page/page.component.ts:20
<Const>
_META_NAME_ID
● _META_NAME_ID: "id" = "id"
Defined in components/page/page.component.ts:19
Functions
_boxValue
▸ _boxValue(aValue?: string
): string
Defined in components/page/page.component.ts:28
Parameters:
| Param | Type |
| ------ | ------ |
| Optional
aValue | string
|
Returns: string
_getDescription
▸ _getDescription(aSitePage: SitePage
, aRenderingContext: RenderingContext
): string
Defined in components/page/page.component.ts:81
Parameters:
| Param | Type |
| ------ | ------ |
| aSitePage | SitePage
|
| aRenderingContext | RenderingContext
|
Returns: string
_getTitle
▸ _getTitle(aSitePage: SitePage
, aRenderingContext: RenderingContext
): string
Defined in components/page/page.component.ts:63
Parameters:
| Param | Type |
| ------ | ------ |
| aSitePage | SitePage
|
| aRenderingContext | RenderingContext
|
Returns: string
_setMetaTag
▸ _setMetaTag(aMetaService: Meta
, aId: string
, aValue?: string
): void
Defined in components/page/page.component.ts:39
Parameters:
| Param | Type |
| ------ | ------ |
| aMetaService | Meta
|
| aId | string
|
| Optional
aValue | string
|
Returns: void
_setTitleTag
▸ _setTitleTag(aTitle: Title
, aValue?: string
): void
Defined in components/page/page.component.ts:50
Parameters:
| Param | Type |
| ------ | ------ |
| aTitle | Title
|
| Optional
aValue | string
|
Returns: void
_updateMetaData
▸ _updateMetaData(aContext: RenderingContext
, aTitleService: Title
, aMetaService: Meta
): void
Defined in components/page/page.component.ts:96
Parameters:
| Param | Type |
| ------ | ------ |
| aContext | RenderingContext
|
| aTitleService | Title
|
| aMetaService | Meta
|
Returns: void
ibm-wch-sdk-ng > "components/pageref/pageref.component"
External module: "components/pageref/pageref.component"
Index
Classes
Variables
Variables
<Const>
LOGGER
● LOGGER: "PagerefComponent" = "PagerefComponent"
Defined in components/pageref/pageref.component.ts:28
ibm-wch-sdk-ng > "components/path/content.path.component"
External module: "components/path/content.path.component"
Index
Classes
Variables
Variables
<Const>
LOGGER
● LOGGER: "ContentPathComponent" = "ContentPathComponent"
Defined in components/path/content.path.component.ts:20
ibm-wch-sdk-ng > "components/rendering/abstract-base.component"
External module: "components/rendering/abstract-base.component"
Index
Classes
Variables
Variables
<Let>
ID
● ID: number
= 0
Defined in components/rendering/abstract-base.component.ts:16
<Const>
LOGGER
● LOGGER: "AbstractBaseComponent" = "AbstractBaseComponent"
Defined in components/rendering/abstract-base.component.ts:14
ibm-wch-sdk-ng > "components/rendering/abstract-rendering.component"
External module: "components/rendering/abstract-rendering.component"
Index
Classes
Variables
Variables
<Let>
ID
● ID: number
= 0
Defined in components/rendering/abstract-rendering.component.ts:20
<Const>
LOGGER
● LOGGER: "AbstractRenderingComponent" = "AbstractRenderingComponent"
Defined in components/rendering/abstract-rendering.component.ts:18
ibm-wch-sdk-ng > "components/rendering/abstract.lifecycle.component"
External module: "components/rendering/abstract.lifecycle.component"
Index
Classes
Type aliases
Variables
- FIELD_CALLBACKS
- FIELD_OBSERVABLE
- HOOK_AFTERCONTENTCHECKED
- HOOK_AFTERCONTENTINIT
- HOOK_AFTERVIEWCHECKED
- HOOK_AFTERVIEWINIT
- HOOK_CHANGES
- HOOK_DESTROY
- HOOK_DOCHECK
- HOOK_INIT
- KEY_REGISTRY
- _Subject
Functions
- _addHook
- _assertCallbacks
- _assertHook
- _createObservable
- _getObservable
- _invokeHooks
- _removeRegistry
- createGetter
- createSetter
Type aliases
Registry
Ƭ Registry: any
[][]
Defined in components/rendering/abstract.lifecycle.component.ts:47
Variables
<Const>
FIELD_CALLBACKS
● FIELD_CALLBACKS: 1
= 1
Defined in components/rendering/abstract.lifecycle.component.ts:44
<Const>
FIELD_OBSERVABLE
● FIELD_OBSERVABLE: 2
= 2
Defined in components/rendering/abstract.lifecycle.component.ts:45
<Const>
HOOK_AFTERCONTENTCHECKED
● HOOK_AFTERCONTENTCHECKED: 2
= 2
Defined in components/rendering/abstract.lifecycle.component.ts:37
<Const>
HOOK_AFTERCONTENTINIT
● HOOK_AFTERCONTENTINIT: 3
= 3
Defined in components/rendering/abstract.lifecycle.component.ts:38
<Const>
HOOK_AFTERVIEWCHECKED
● HOOK_AFTERVIEWCHECKED: 0
= 0
Defined in components/rendering/abstract.lifecycle.component.ts:35
<Const>
HOOK_AFTERVIEWINIT
● HOOK_AFTERVIEWINIT: 1
= 1
Defined in components/rendering/abstract.lifecycle.component.ts:36
<Const>
HOOK_CHANGES
● HOOK_CHANGES: 6
= 6
Defined in components/rendering/abstract.lifecycle.component.ts:41
<Const>
HOOK_DESTROY
● HOOK_DESTROY: 7
= 7
Defined in components/rendering/abstract.lifecycle.component.ts:42
<Const>
HOOK_DOCHECK
● HOOK_DOCHECK: 4
= 4
Defined in components/rendering/abstract.lifecycle.component.ts:39
<Const>
HOOK_INIT
● HOOK_INIT: 5
= 5
Defined in components/rendering/abstract.lifecycle.component.ts:40
<Const>
KEY_REGISTRY
● KEY_REGISTRY: unique symbol
= Symbol()
Defined in components/rendering/abstract.lifecycle.component.ts:50
<Const>
_Subject
● _Subject: Subject
= Subject
Defined in components/rendering/abstract.lifecycle.component.ts:30
Functions
_addHook
▸ _addHook(aHookIdentifier: number
, aThis: AbstractLifeCycleComponent, aHook: Function
): void
Defined in components/rendering/abstract.lifecycle.component.ts:132
Parameters:
| Param | Type |
| ------ | ------ |
| aHookIdentifier | number
|
| aThis | AbstractLifeCycleComponent |
| aHook | Function
|
Returns: void
_assertCallbacks
▸ _assertCallbacks(aHook: any
[]): Function
[]
Defined in components/rendering/abstract.lifecycle.component.ts:79
Parameters:
| Param | Type |
| ------ | ------ |
| aHook | any
[] |
Returns: Function
[]
_assertHook
▸ _assertHook(aHookIdentifier: number
, aThis: AbstractLifeCycleComponent): any
[]
Defined in components/rendering/abstract.lifecycle.component.ts:68
Parameters:
| Param | Type |
| ------ | ------ |
| aHookIdentifier | number
|
| aThis | AbstractLifeCycleComponent |
Returns: any
[]
_createObservable
▸ _createObservable(aHookIdentifier: number
, aHook: any
[], aThis: AbstractLifeCycleComponent): Observable
<any
>
Defined in components/rendering/abstract.lifecycle.component.ts:92
Parameters:
| Param | Type |
| ------ | ------ |
| aHookIdentifier | number
|
| aHook | any
[] |
| aThis | AbstractLifeCycleComponent |
Returns: Observable
<any
>
_getObservable
▸ _getObservable(aHookIdentifier: number
, aThis: AbstractLifeCycleComponent): Observable
<any
>
Defined in components/rendering/abstract.lifecycle.component.ts:122
Parameters:
| Param | Type |
| ------ | ------ |
| aHookIdentifier | number
|
| aThis | AbstractLifeCycleComponent |
Returns: Observable
<any
>
_invokeHooks
▸ _invokeHooks(aHookIdentifier: number
, aThis: AbstractLifeCycleComponent, aArgs: IArguments
): void
Defined in components/rendering/abstract.lifecycle.component.ts:145
Parameters:
| Param | Type |
| ------ | ------ |
| aHookIdentifier | number
|
| aThis | AbstractLifeCycleComponent |
| aArgs | IArguments
|
Returns: void
_removeRegistry
▸ _removeRegistry(aThis: AbstractLifeCycleComponent): void
Defined in components/rendering/abstract.lifecycle.component.ts:57
Parameters:
| Param | Type | | ------ | ------ | | aThis | AbstractLifeCycleComponent |
Returns: void
createGetter
▸ createGetter<T
>(aObservable: Observable
<T
>, aThis: AbstractLifeCycleComponent, aInitial?: T
): PropertyDescriptor
Defined in components/rendering/abstract.lifecycle.component.ts:406
Constructs a getter that subscribes to a value
Type parameters:
T
Parameters:
| Param | Type | Description |
| ------ | ------ | ------ |
| aObservable | Observable
<T
> | the observable |
| aThis | AbstractLifeCycleComponent | the component |
| Optional
aInitial | T
| the optional initial value |
Returns: PropertyDescriptor
the descriptor
createSetter
▸ createSetter<T
>(aSubject: Subject
<T
>, aThis: AbstractLifeCycleComponent): PropertyDescriptor
Defined in components/rendering/abstract.lifecycle.component.ts:390
Constructs a setter that is unregistered automatically in onDestroy
Type parameters:
T
Parameters:
| Param | Type | Description |
| ------ | ------ | ------ |
| aSubject | Subject
<T
> | the subject |
| aThis | AbstractLifeCycleComponent | the component |
Returns: PropertyDescriptor
the descriptor
ibm-wch-sdk-ng > "components/site/site.component"
External module: "components/site/site.component"
Index
Classes
Variables
Variables
<Const>
LOGGER
● LOGGER: "SiteComponent" = "SiteComponent"
Defined in components/site/site.component.ts:12
ibm-wch-sdk-ng > "decorators/bootstrap/rendering.context.bootstrap.decorator"
External module: "decorators/bootstrap/rendering.context.bootstrap.decorator"
Index
Functions
Functions
ContentWithLayoutBootstrap
▸ ContentWithLayoutBootstrap(aDirective?: ContentWithLayoutBootstrapDirective): function
Defined in decorators/bootstrap/rendering.context.bootstrap.decorator.ts:11
Parameters:
| Param | Type |
| ------ | ------ |
| Optional
aDirective | ContentWithLayoutBootstrapDirective |
Returns: function
ibm-wch-sdk-ng > "decorators/bootstrap/rendering.context.bootstrap.directive"
External module: "decorators/bootstrap/rendering.context.bootstrap.directive"
Index
Interfaces
ibm-wch-sdk-ng > "decorators/bootstrap/site.bootstrap.decorator"
External module: "decorators/bootstrap/site.bootstrap.decorator"
Index
Variables
Functions
Variables
<Const>
LOGGER
● LOGGER: "SiteBootstrap" = "SiteBootstrap"
Defined in decorators/bootstrap/site.bootstrap.decorator.ts:8
Functions
SiteBootstrap
▸ SiteBootstrap(aDirective?: SiteBootstrapDirective): function
Defined in decorators/bootstrap/site.bootstrap.decorator.ts:15
Parameters:
| Param | Type |
| ------ | ------ |
| Optional
aDirective | SiteBootstrapDirective |
Returns: function
ibm-wch-sdk-ng > "decorators/bootstrap/site.bootstrap.directive"
External module: "decorators/bootstrap/site.bootstrap.directive"
Index
Interfaces
ibm-wch-sdk-ng > "decorators/layout/layout.decorator"
External module: "decorators/layout/layout.decorator"
Index
Interfaces
Type aliases
Variables
- KEY_EXPRESSION
- KEY_OBSERVABLE_PREFIX
- KEY_ON_DESTROY
- KEY_SUBSCRIPTIONS
- LOGGER
- UNDEFINED_RENDERING_CONTEXT_SUBJECT
- _BehaviorSubject
- _SYMBOLS
- _expressionCache
Functions
- LayoutComponent
- LayoutMapping
- RenderingContextBinding
- _assertBinding
- _baseExpressionFromObservableExpression
- _getExpressionFromDescriptor
- _getExpressionFromPrototype
- _getExpressionGetter
- _getObservableExpression
- _getOnRenderingContext
- _getResolvedExpression
- _getSymbol
- _isObservableExpression
- _isUpperCase
- _observableExpressionFromBaseExpression
- _parseExpression
- _registerExpression
- _registerRenderingContextDirective
- _registerSubscription
Type aliases
ExpressionGetter
Ƭ ExpressionGetter: function
Defined in decorators/layout/layout.decorator.ts:309
Type declaration
▸(): string
Returns: string
Subscriptions
Ƭ Subscriptions: Subscription
[]
Defined in decorators/layout/layout.decorator.ts:43
Variables
<Const>
KEY_EXPRESSION
● KEY_EXPRESSION: "45b01348-de92-44a0-8103-7b7dc471ad8c" = "45b01348-de92-44a0-8103-7b7dc471ad8c"
Defined in decorators/layout/layout.decorator.ts:41
<Const>
KEY_OBSERVABLE_PREFIX
● KEY_OBSERVABLE_PREFIX: "on" = "on"
Defined in decorators/layout/layout.decorator.ts:36
<Const>
KEY_ON_DESTROY
● KEY_ON_DESTROY: "ngOnDestroy" = "ngOnDestroy"
Defined in decorators/layout/layout.decorator.ts:37
<Const>
KEY_SUBSCRIPTIONS
● KEY_SUBSCRIPTIONS: unique symbol
= Symbol()
Defined in decorators/layout/layout.decorator.ts:38
<Const>
LOGGER
● LOGGER: "LayoutDecorator" = "LayoutDecorator"
Defined in decorators/layout/layout.decorator.ts:33
<Const>
UNDEFINED_RENDERING_CONTEXT_SUBJECT
● UNDEFINED_RENDERING_CONTEXT_SUBJECT: BehaviorSubject
<RenderingContext
> = new _BehaviorSubject(UNDEFINED_RENDERING_CONTEXT)
Defined in decorators/layout/layout.decorator.ts:143
<Const>
_BehaviorSubject
● _BehaviorSubject: BehaviorSubject
= BehaviorSubject
Defined in decorators/layout/layout.decorator.ts:34
<Const>
_SYMBOLS
● _SYMBOLS: Symbols
Defined in decorators/layout/layout.decorator.ts:56
<Const>
_expressionCache
● _expressionCache: object
Defined in decorators/layout/layout.decorator.ts:71
Type declaration
Functions
LayoutComponent
▸ LayoutComponent(aDirective?: LayoutComponentDirective): function
Defined in decorators/layout/layout.decorator.ts:459
Parameters:
| Param | Type |
| ------ | ------ |
| Optional
aDirective | LayoutComponentDirective |
Returns: function
LayoutMapping
▸ LayoutMapping(aID: * string
| string
[], aSelector?: * string
| string
[] | Type
<any
>, aLayoutMode?: * string
| string
[]*): function
Defined in decorators/layout/layout.decorator.ts:499
Parameters:
| Param | Type |
| ------ | ------ |
| aID | string
| string
[]|
| Optional
aSelector | string
| string
[] | Type
<any
>|
| Optional
aLayoutMode | string
| string
[]|
Returns: function
RenderingContextBinding
▸ RenderingContextBinding<T
>(aBinding?: * string
| RenderingContextDirective<T
>*, aDefault?: T
): function
Defined in decorators/layout/layout.decorator.ts:485
Type parameters:
T
Parameters:
| Param | Type |
| ------ | ------ |
| Optional
aBinding | string
| RenderingContextDirective<T
>|
| Optional
aDefault | T
|
Returns: function
_assertBinding
▸ _assertBinding<T
>(aInstance: any
, aSymbol: symbol
, aName: string
): Binding<T
>
Defined in decorators/layout/layout.decorator.ts:138
Makes sure we have a binding
Type parameters:
T
Parameters:
| Param | Type | Description |
| ------ | ------ | ------ |
| aInstance | any
| the instance to attach the binding to |
| aSymbol | symbol
| the symbol |
| aName | string
| name of the object |
Returns: Binding<T
>
the binding
_baseExpressionFromObservableExpression
▸ _baseExpressionFromObservableExpression(aKey: string
): string
Defined in decorators/layout/layout.decorator.ts:294
Parameters:
| Param | Type |
| ------ | ------ |
| aKey | string
|
Returns: string
_getExpressionFromDescriptor
▸ _getExpressionFromDescriptor(aPrototype: any
, aOtherKey: string
): string
| null
| undefined
Defined in decorators/layout/layout.decorator.ts:319
Returns an expression from its descriptor
Parameters:
| Param | Type | Description |
| ------ | ------ | ------ |
| aPrototype | any
| the prototype |
| aOtherKey | string
| the key |
Returns: string
| null
| undefined
the expression, null if no expression exists and undefined if we need to fallback
_getExpressionFromPrototype
▸ _getExpressionFromPrototype(aPrototype: any
, aOtherKey: string
): string
| null
| undefined
Defined in decorators/layout/layout.decorator.ts:345
Checks if we can find an expression from the other property
Parameters:
| Param | Type | Description |
| ------ | ------ | ------ |
| aPrototype | any
| the prototype |
| aOtherKey | string
| the other key |
Returns: string
| null
| undefined
the expression, null if no expression exists and undefined if we need to fallback
_getExpressionGetter
▸ _getExpressionGetter(aPrototype: any
, aExpression: * string
| null
| undefined
*, aKey: string
, aOtherKey: string
): ExpressionGetter
Defined in decorators/layout/layout.decorator.ts:370
Returns a getter method that computes the expression associated with a property
Parameters:
| Param | Type | Description |
| ------ | ------ | ------ |
| aPrototype | any
| current prototype |
| aExpression | string
| null
| undefined
| the expression, may be null or undefined |
| aKey | string
|
| aOtherKey | string
| the alternative key |
Returns: ExpressionGetter the getter. The getter