Getting started (Angular)

Allgemein

Das TypeScript-Frontend verfügt nicht über dieselben Funktionalitäten wie das GWT-Frontend oder der Swing-Client. Eine Liste der Limitations kann in der Knowledge-Base eingesehen werden.

Setup npm

Im ersten Schritt muss npm so eingestellt werden, dass alle Artefakte unter dem Scope @levigo vom levigo Nexus heruntergeladen werden. Hierfür wird ein Account benötigt, welchen Sie über den jadice support erhalten können. Wenn Sie bereits einen Account für den levigo haben, muss dieser noch über den jadice support freigeschaltet werden.

npm config set registry https://artifacts.jadice.com/repository/npm-hosted/ --scope=@levigo
npm login --scope=@levigo

Installation

Nun müssen die benötigten Dependencies installiert werden.

npm install @levigo/ngx-webtoolkit

Versionen der Dependencies

Das TypeScript-Frontend ist modular aufgebaut, weshalb unterschiedliche Dependencies benötigt werden. Diese sind jedoch transitiv in @levigo/ngx-webtoolkit enthalten und müssen nicht separat installiert werden.

Dependency	Funktion	Versions-Schema
@levigo/ngx-webtoolkit	Viewer Angular Komponenten	Folgt der Versionierung von Angular
@levigo/webtoolkit-ng-client	Viewer Web-Components	Folgt der Versionierung des jadice web toolkit (aktuell 6.x.x)
@levigo/ngx-translate-support	Tools für i18n (Angular)	Folgt der Versionierung von Angular
@levigo/jadice-common-components	Common Web Components like buttons that are used for all modern jadice web based solutions	Einfaches SemVer
@levigo/common-components-angular	Angular wrapper for the library above	Folgt der Versionierung von Angular
@levigo/jadice-i18n-support	Tools für i18n	Einfaches SemVer
@levigo/jadice-math	Contains mathematical utilities for web projects (used internally)	Einfaches SemVer
@levigo/jadice-web-icons	Icon-Font	Einfaches SemVer
@levigo/utility-types	useful utils that make working with RxJS easier	Einfaches SemVer

Angular version compatibility

Die folgende Tabelle zeigt, welche ngx-webtoolkit-Version mit der jeweiligen Angular Version kompatibel ist.

Angular	@levigo/ngx-webtoolkit
20.x.x	>= 20.0.0 & < 21
19.x.x	>= 19.0.0 & < 20
18.x.x	>= 18.0.0 & < 19

note

In der Vergangenheit war das jadice web toolkit und die Angular-Teile gemeinsam versioniert. Mit der Unterstützung von Angular 17 im jadice web viewer wurde dieses Versionsschema angepasst. Die Major-Version von ngx-webtoolkit entspricht nun immer der unterstützten Angular-Version. Die letzten beiden Stellen (Minor und Patch) sind unabhängig von Angular und entsprechen wie gewohnt SemVer.

note

Die Angular Komponenten von jadice web toolkit unterstützen diejenigen Angular Versionen, die auch von Angular unter Support stehen. Eine Übersicht der von Angular unterstützten Versionen kann hier eingesehen werden.

Verwendung

Modul laden

Im jeweiligen Angular-Modul muss das Webtoolkit-Modul geladen werden.

// some.module.ts
import { NgModule } from '@angular/core';
// your very important imports here

// jadice web toolkit
import { WebtoolkitModule } from '@levigo/ngx-webtoolkit';

// other stuff
@NgModule({
  imports: [
    // ...
    // gets everything ready!
    WebtoolkitModule.forRoot(),
    // ...
  ]
})
export class SomeModule {}

Styles einbinden

Dieser Vorgang wird unter Styling beschrieben.

In Template einbinden

Folgendes Beispiel lädt ein einfaches PDF Dokument.

    <jwt-multi-mode-viewer [source]="{uri: 'http://www.digbib.org/Franz_Kafka_1883/Der_Prozess_.pdf'}"/>