tss-img-lib
Version:
Install the package using the following command
71 lines (61 loc) • 2.03 kB
Markdown
Install the package using the following command
***
**npm i tss-img-lib**
***
After installing declare the img-lib module in **app.module.ts**
***
**import {ImgLibModule} from 'tss-img-lib';**
***
You need to download primeng and font-awesome node modules from npm if it is not installed in your project.
The commands for installing primeng and font-awesome
***
* **npm install primeng --save**
* **npm install font-awesome --save**
***
If primeng and font-awesome are already installed then import the following in **app.module.ts**
***
* **import {DialogModule} from 'primeng/dialog';**
* **import {BrowserAnimationsModule} from '@angular/platform-browser/animations';**
* **import {ButtonModule} from 'primeng/button';**
***
After importing all the modules in **app.module.ts** make sure they are imported in **Imports** tag in ****
***
Now in-order to use the img-lib module to display the image send the options array by calling the selector in the required html tag in the following way
***
**`<lib-view [options]="options"></lib-view>`**
***
In options variable send the required option like source,height,width etc.The following options you can send and based on the data the image will render
***
The options variable show be binded to Imageproperties interface by the following declarations
***
**options: Imageproperties;**
***
It is imported in the following way
***
*`import { Imageproperties } from 'tss-img-lib/lib/view/imageproperties'`*;
***
The options json is
***
`this.options={`
` id:number`
` source:string`
` description:string`
` width:number`
` height:number`
` positionX:number`
` positionY:number`
` className:string`
` style:string`
` dataset:any`
` datasetColumn:any`
` alternateText:any`
` rollOverimage:any`
` rollOverStyle:any`
` html:any`
` code:any`
` opacity:number`
` link:string`
` hasTooltip (yes|no):any`
` tooltip (tooltip text come here...):any`
`}`
***