knowledgeowl-angular

Knowledge Owl Angular

Downloads in past

Stats

StarsIssuesVersionUpdatedCreatedSize
knowledgeowl-angular
004.1.54 months ago5 years agoMinified + gzip package size for knowledgeowl-angular in KB

Readme

knowledgeowl-angular
Build Status styled with prettier
Project that enables angular application to integrate KnowledgeOwl widget. This gives following features:
  1. Integrate KnowledgeOwl angular widget into application.
  2. Link HTML element to KnowledgeOwl article.

How to install?

You can use npm command line tool to install package.
npm install knowledgeowl-angular

How to use?

Import the Module:
import {KnowledgeOwlWidgetModule, KnowledgeOwlLinkModule} from 'knowledgeowl-angular';

@NgModule({
  ...
  imports: [KnowledgeOwlWidgetModule, KnowledgeOwlLinkModule],
  providers: [{provide: 'KOProjectURL', useValue: 'https://knowledgeowlurl.com'}]
  ...
})
export class AppModule { }

Add widget in app.component.html
<knowledge-owl-widget
    [projectKey]="'projectKeyProvidedByKnowledgeOwl'"
></knowledge-owl-widget>

How to link article to <a> or button?

<a knowledgeOwlLink="test-article"></a>

Directives

KnowledgeOwlWidget

Selector: knowledge-owl-widget
Exported as: knowledgeOwlWidget

Properties

| Name | Required | Description | | ------------------------------------ | -------- | ---------------------------------------------- | | @Input()
projectKey: string | true | Product key to access KnowledgeOwl widget | | @Input()
pageLocation: string | false | Page location of application. Example "\start" |

Open the widget programmatically

The widget exposes an API to open/close programmatically.
class MyComponent {
  @ViewChild(KnowledgeOwlWidget) widget: KnowledgeOwlWidget;

  someMethod() {
    this.widget.open();
  }
}

Open the article in widget programmatically

The widget exposes an API to open/close widget with article programmatically.
class MyComponent {
  @ViewChild(KnowledgeOwlWidget) widget: KnowledgeOwlWidget;

  someMethod() {
    this.widget.open('article-name');
  }
}

Directives

KnowledgeOwlLink

Selector: knowledgeOwlLink
Exported as: knowledgeOwlLink

Properties

| Name | Required | Description | | ---------------------------------------- | -------- | ------------------------- | | @Input()
knowledgeOwlLink: string | true | KnowledgeOwl Article Name |