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
- Install npm package ngx-xml-message.
npm i ngx-xml-message
- 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"
]
}
- View
<ngx-xml-message [xmlMessage]="message" [showNamspace]="true"></ngx-xml-message>
- 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;
});
}
- Translation Support It support name and id properties of the SchemaElement
{
"Hdr": "Header",
"MsgId": "Message Id"
}
Release
version 1.0.2
With verions_1.0.2 user will able to see content copy button. User can use XmlMessageConfig to control the display of content copy button as well as namespace.
export interface XmlMessageConfig{
showNamespace?: boolean;
showCopy?: boolean;
}