image-upload-lib v1.0.3
How to use the Reusable Image Uploader component
- Install
npm i image-upload-lib@latest
into your project. - Import
MyImageUploadModule
into your app.module.ts file - Example: import { MyImageUploadModule } from 'image-upload-lib'; imports: MyImageUploadModule
- Use the
<lib-image-upload></lib-image-upload>
tag to use the reusable image uploader component into your project. - On Click on the “Choose File” option to select the image from the local device.
- After choose the image, it will display the preview of selected Image in the left Image tag.
- Until we select the image the “Upload Image” button will disabled, once user selects the Image the button will be enabled.
- Click the “Upload Image” button to send the file as FomData to server and display the file name in alert box.
- In alert box, displaying message like “File XYZ.png is uploaded…”
MyImageUpload
This library was generated with Angular CLI version 10.0.6.
Code scaffolding
Run ng generate component component-name --project my-image-upload
to generate a new component. You can also use ng generate directive|pipe|service|class|guard|interface|enum|module --project my-image-upload
.
Note: Don't forget to add
--project my-image-upload
or else it will be added to the default project in yourangular.json
file.
Build
Run ng build my-image-upload
to build the project. The build artifacts will be stored in the dist/
directory.
Publishing
After building your library with ng build my-image-upload
, go to the dist folder cd dist/my-image-upload
and run npm publish
.
Running unit tests
Run ng test my-image-upload
to execute the unit tests via Karma.
Further help
To get more help on the Angular CLI use ng help
or go check out the Angular CLI README.