JSPM

  • ESM via JSPM
  • ES Module Entrypoint
  • Export Map
  • Keywords
  • License
  • Repository URL
  • TypeScript Types
  • README
  • Created
  • Published
  • Downloads 14712
  • Score
    100M100P100Q129007F
  • License Apache-2.0

This form is used to design Angular Reactive Form using any given XML. The primary use of this Readonly UI library is to design ISO 20022 XML messages in forms dynamically.

Package Exports

  • ngx-xml-message
  • ngx-xml-message/package.json

Readme

Display XML & ISO 20022 messages using Angular Forms

npm NPM npm


NgxXmlMessage

This form is used to design Angular Readonly Form using any given XML/ISO 20022 messages. The primary use of this UI library is to design ISO 20022 or MX readonly forms dynamically.

Features

  • 🔥 Automatic forms generation
  • ⚡️ Supports ISO 20022 messages:
    • Support translation labels.
  • 💪 Built on top of Angular Reactive Forms

Live Demo

How to consume

  1. Install npm package ngx-xml-message.
    npm i ngx-xml-message
  1. Import Module & SCSS
import { NgxXmlMessageModule } from 'ngx-xml-message';

@NgModule({
    ...
  imports:[NgxXmlMessageModule],
    ...
})

Add style file to angular.json file

{
    styles:[
     "node_modules/ngx-xml-message/lib/styles/index.scss"
    ]
}
  1. View
<ngx-xml-message [xmlMessage]="message" [showNamspace]="true"></ngx-xml-message>
  1. Component
export class AppComponent implements OnInit {
    message: string;
     const xmlPath = `./assets/xml/${params['xml']}.xml`;
        this.httpClient.get(xmlPath,{ responseType: 'text' }).subscribe((data) => {
          this.message = data as string;
     });
}
  1. Translation Support It support name and id properties of the SchemaElement
{
    "Hdr": "Header",
    "MsgId": "Message Id"
}