{"_id":"@dovipas/ngx-is-image-loaded","_rev":"1-001896ebae592c47b1a1b6804ad21187","name":"@dovipas/ngx-is-image-loaded","dist-tags":{"latest":"1.0.0"},"versions":{"1.0.0":{"name":"@dovipas/ngx-is-image-loaded","version":"1.0.0","license":"MIT","description":"Simple Angular 6+ directive that tells if an image is loaded.","peerDependencies":{"@angular/common":"^8.0.0","@angular/core":"^8.0.0"},"keywords":["angular directive","angular","library","directive","ngx","is","image","loaded","is image loaded"],"repository":{"url":"git+https://github.com/dovipas/ngx-is-image-loaded.git","type":"git"},"author":{"name":"kubadospial","url":"@kubadospial"},"bugs":{"url":"https://github.com/dovipas/ngx-is-image-loaded/issues"},"homepage":"https://github.com/dovipas/ngx-is-image-loaded#readme","main":"bundles/dovipas-ngx-is-image-loaded.umd.js","module":"fesm5/dovipas-ngx-is-image-loaded.js","es2015":"fesm2015/dovipas-ngx-is-image-loaded.js","esm5":"esm5/dovipas-ngx-is-image-loaded.js","esm2015":"esm2015/dovipas-ngx-is-image-loaded.js","fesm5":"fesm5/dovipas-ngx-is-image-loaded.js","fesm2015":"fesm2015/dovipas-ngx-is-image-loaded.js","typings":"dovipas-ngx-is-image-loaded.d.ts","metadata":"dovipas-ngx-is-image-loaded.metadata.json","sideEffects":false,"dependencies":{"tslib":"^1.9.0"},"_id":"@dovipas/ngx-is-image-loaded@1.0.0","_nodeVersion":"12.13.1","_npmVersion":"6.12.1","dist":{"integrity":"sha512-FL4Bbr4cWk+mzTTF8xm5bINb6M8UtlsbocFWuR1Lo5gdDbKGpnUahLOL+//Q0Yxsl+LQ7RLve73o9+hxcU8XBA==","shasum":"bebdd818a176170fa7e3cdc74ca540fd273ca77b","tarball":"https://registry.npmjs.org/@dovipas/ngx-is-image-loaded/-/ngx-is-image-loaded-1.0.0.tgz","fileCount":23,"unpackedSize":113008,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJeGF7ZCRA9TVsSAnZWagAA4CMP/jT266MfC5tQzIx0EO72\n0Ltt5mFONLWflwOMGmFvPrHu1BMQMVPVJlapjZRYthkKiFipAns57yTm0br5\nWZHemZUoSFaxwV7CXBbqd0+wVeTlnpepMJZYYAeg9PRHzN8kymwAnG1oz4vY\nIth2mxhoGp7kYah492lpPDM1ieBcpIbwi1kHq5rUBnAzGC/XMijddk9WHeSL\n6B9FszOys9+/Yr6hIUcZqc+3cI12x86kRrib/xG7IxWQjo6VRuYEm411G9tI\nEUNQafk2pmwzERFX9lJPNzETgMjZw9kZZS0KqTK5znmrGFkj5k9JvV7BhrhD\nS9dJkjxfjF0R3YIzTa+U7523dfqKWqI8fOeHBiJtBzoUg/B539FOWpglelCS\noRdNW9hgPT5BfD6nCWQCcviYQUJLm4BYHcZ34hZe9ByHR5sJ6dNZ9DmHGu33\ni7nB2GtRZOGg/CpllWKk8Gouge7dryotyZYvtB8ztgQniTLyXge2M83H/fke\n7E4mOI4Bf6or+XZV+6OdKNboLxaE5okAcCbT4YQiVIu+5DJi28BW83JJqogH\nNNG/AlnXY2xk9SxQtNHqUFtmRprLf7gIdo2PlSiMdbdEFNbxznJ+u3Fb8xpN\nbugOsEuJC+mVV809We16nF786Nt3M3GRsdexcyk4i3enbOC3UU8qd3VYLjw5\noT3R\r\n=bsQi\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQD8wV32iEpGm2IAiSFmTrMSmQG/gD9HEb86rhckZSwGvwIhAKEmQbwYeGtWaNYbVzdBpQhhW5t8W9QkmWVCIctfTqXK"}]},"maintainers":[{"name":"dovipas","email":"david@oviedo.me"}],"_npmUser":{"name":"dovipas","email":"david@oviedo.me"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/ngx-is-image-loaded_1.0.0_1578655449088_0.7194562162305516"},"_hasShrinkwrap":false}},"time":{"created":"2020-01-10T11:24:09.055Z","1.0.0":"2020-01-10T11:24:09.311Z","modified":"2022-04-05T05:31:10.807Z"},"maintainers":[{"name":"dovipas","email":"david@oviedo.me"}],"description":"Simple Angular 6+ directive that tells if an image is loaded.","homepage":"https://github.com/dovipas/ngx-is-image-loaded#readme","keywords":["angular directive","angular","library","directive","ngx","is","image","loaded","is image loaded"],"repository":{"url":"git+https://github.com/dovipas/ngx-is-image-loaded.git","type":"git"},"author":{"name":"kubadospial","url":"@kubadospial"},"bugs":{"url":"https://github.com/dovipas/ngx-is-image-loaded/issues"},"license":"MIT","readme":"# NgxIsImageLoaded\n\nIf You are looking for simple Angular 6+ directive that tells if an image is loaded. This is the place!\n\n## Note\n```\nDirective requires Rxjs version >= 6.0.0.\n```\n\n## Demo\nCheck the [link](https://kubadospial.github.io/ngx-is-image-loaded/)\n\n## Usage\n\nInstall ngx-positioner\n- npm: ``` $ npm install ngx-is-image-loaded ``` \n- yarn: ``` $ yarn add ngx-is-image-loaded ``` \n\nimport NgxIsImageLoadedModule\n\n```js\nimport { NgxIsImageLoadedModule } from 'ngx-is-image-loaded';\n\n@NgModule({\n  declarations: [SomeComponent, ...],\n  imports: [\n    ...\n    NgxIsImageLoadedModule\n  ],\n  providers: []\n})\n```\n\nUse NgxIsImageLoadedDirective\n```js\n@Component(...)\nexport class SomeComponent {\n  ...\n  isImgLoaded = false;\n  \n  url = 'https://123.com/image.jpg';\n  // or\n  // url = ['https://123.com/image.jpg','https://123.com/image.jpg','https://123.com/image.jpg'];\n\n  onImageLoaded(isLoaded: boolean) {\n    this.isImageLoaded = isLoaded;\n  }\n\n```\nAnd\n```html\n<div class=\"container\"\n       ngxIsImageLoaded\n       (isImageLoaded)=\"onImageLoaded($event)\"\n       [isLoadSequenced]=\"true\"\n       [url]=\"url\">\n    <img alt=\"image\"\n         src=\"{{url}}\"\n         *ngIf=\"isImgLoaded\">\n  </div>\n```\n\n## Directive\n### Inputs:\nurl: string | Array<string>;\n\n```\nurl input can take string or array of strings with urls;\n```\nisLoadSequenced: boolean;\n```\nIf You want to use array of string in url input, You can load every url sequentially;\n\nDefault value: false;\n```\n\n### Outputs:\nisImageLoaded: boolean;\n```\nisImageLoaded: EventEmitter that emits boolean is url or array of urls is loaded;\n```\n\n## Contributing\n1. Fork repo.\n2. `npm install / yarn`.\n3. Make your changes.\n4. Add your tests.\n5. `npm run test / yarn start test`.\n6. `npm run build / yarn start build`.\n7. After all tests are passing. \n8. Commit, push, PR.\n\n## License\nReleased under the terms of MIT License.\n","readmeFilename":"README.md"}