The component registry (registry.ts
module) holds a mapping of component names to their respective type. e.g. "Button"
-> Button
.
This is needed since Angular templates on the one hand are plain strings (that get parsed), and on the other React.createElement
relies on types to know what components to create (or strings, for native HTML elements).
Registration
Each React component that should be renderer-able needs to be registered in the component registry by calling the registerElement(elementName, resolver)
function.
This is usually done in Wrapper libraries' individual NgModule
s's constructor
:
export class FabCheckboxModule {
constructor() {
registerElement('Checkbox', () => Checkbox);
}
}
The registerElement
function can be called multiple times. Any call to an already-registered elementName
is discarded, for simplicity's sake with Angular and lazy-loaded modules. See the docs within the code for more info on that.
Caveats
The registry is a singleton one, much like the way ReactRenderer
is currently, but there are no technical challenges that prevent changing this in the future. See limitations for more info on this.