This is an example project showing how to install and use the `@wiwo/widget-angular8` library to embed a [Widget Works](https://www.widgetworks.com.au) Widget into an Angular 8 project.
npm install @wiwo/widget-angular8@wiwo/widget-angular8 library to embed a Widget Works
$ npm install -S @wiwo/widget-angular8
`
The package.json should now include this library as a dependency:
`
// package.json
{
"dependencies": {
"@wiwo/widget-angular8": "^v..."
}
}
`
--------------------------
Register module
In your application app.module.ts import and register the WiwoWidgetModule
`typescript
// app.module.ts
// 1. import WiwoWidgetModule
import { WiwoWidgetModule } from '@wiwo/widget-angular8';
@NgModule({
declarations: [
AppComponent,
],
imports: [
// ...
// 2. Register the module as an import
WiwoWidgetModule,
],
providers: [],
bootstrap: [AppComponent]
})
export class AppModule { }
`
--------------------------
Usage
You can now use the wiwo-widget-input and wiwo-widget components in your application.
The WiwoWidgetModule provides the following components:
* wiwo-widget-input exposes the Widget as a ControlValueAccessor and accepts a formControl or formControlName prop
The licenseId will be provided to you later.
`html
licenseId="required string; the Widget license to embed in the application"
[formControl]="optional; the FormControl instance that will receive the JSON-encoded string of the Widget state"
formControlName="optional; the form control name for the associated FormControl"
>
`
If formControl or formControlName is given then that form control will be updated with the current state
of the Widget as the user interacts with the Widget instance.
* wiwo-widget embeds the Widget in the page
`html
licenseId="required string; the Widget license to embed in the application"
[value]="optional string; the JSON-encoded string representing the Widget state to restore on startup; if not provided the Widget will initialise with its default values"
>
``