Xml Viewer Component - a simple XML prettifier
npm install xml-viewer-componentA simple XML viewer. This component adds markup to your XML. Now supports CDATA section.
Run npm install xml-viewer-component --save*
* Put a script tag in the head of your index.html
* Then you can use the element anywhere in your template, JSX, html etc.
#### Xml
Gets or sets XML content as string. After setting it renders automatically.
Usage:
``typescript
const xmlviewer: XmlViewerComponent;
// Set new data
xmlviewer.xml =
;
// Get xml data
const xmlData: string = xmlviewer.xml;
`
To use this cool component in a React application you should do the foloowing:
Import and apply polyfills and allow to work with custom elements. Thus add import to your index.js or other initial file:
`javascript`
import { applyPolyfills, defineCustomElements } from 'xml-viewer-component/dist/loader';
Then call to applyPolyfills() and then to defineCustomElements, literally. Do it right after registering or unregistering your service worker[s]
`javascript
// serviceWorker.register();
serviceWorker.unregister();
applyPolyfills().then(() => {
defineCustomElements(window);
});
`
Then import xml-viewer-component in your App.js or any other component you want to add xml-viewer to and add it to your render() function like this:
`javascript
import 'xml-viewer-component';
export class MyReactComponent extends Component {
render() {
}
}
`
Or in case of a function component:
`javascript
import 'xml-viewer-component';
function MyReactComponent() {
return (
)
}
``
Please refer to Angular demo application