{"_id":"@elefantling/ngx-load","_rev":"3-8ccdfe0214c0c820442f116c756e2f2e","name":"@elefantling/ngx-load","dist-tags":{"latest":"0.0.3"},"versions":{"0.0.1":{"name":"@elefantling/ngx-load","version":"0.0.1","peerDependencies":{"@angular/common":"^12.0.0","@angular/core":"^12.0.0","@angular/platform-browser":"12.0.0","rxjs":"~6.6.0"},"dependencies":{"tslib":"^2.1.0"},"publishConfig":{"access":"public"},"main":"bundles/elefantling-ngx-load.umd.js","module":"fesm2015/elefantling-ngx-load.js","es2015":"fesm2015/elefantling-ngx-load.js","esm2015":"esm2015/elefantling-ngx-load.js","fesm2015":"fesm2015/elefantling-ngx-load.js","typings":"elefantling-ngx-load.d.ts","sideEffects":false,"description":"This library was generated with [Nx](https://nx.dev).","_id":"@elefantling/ngx-load@0.0.1","_nodeVersion":"15.10.0","_npmVersion":"7.11.0","dist":{"integrity":"sha512-RE9UIiVZYTiy+7c3xIfCGsStTkv79q62fHM3TlBdPo3EGO74Zl/3wXoUUckG2l6MSVuqmQeisL3lmUV+cuU1tg==","shasum":"376b7509b28c33e9ffd32d0d7f1858385a93b3c0","tarball":"https://registry.npmjs.org/@elefantling/ngx-load/-/ngx-load-0.0.1.tgz","fileCount":24,"unpackedSize":121446,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJgv8w+CRA9TVsSAnZWagAALKMP/32Vye2naWX3RheGO/mn\nBD+b0POtzdglhzPb/WB5ETA2IXUJEajCGDxN1TdEfwLZemy9Er2iNILCUq0c\nmynmFmtLSxjpHeBSyp1tOPtInqbgUbErHFuGVikClweujIVVT0NSfhieoMSA\nvb4XzNkT9Z7yL++80tKMth77heE+rbIfZvxOR+6C7nrGdQE4IA54DQ8a34xb\nR9nO0DiL54PtyfQ97eIxnQDLX/WkB8aNcvyGp21ghrOI3JNxDOUCDLDooSCj\n1FWJEhq8kzsApKdMZvCpoIkyOVRBNSaZzNsWc4hyibs/hPhqsgSrhAg+PF01\nnnpnGCu1/JnMCknBlSh4kHA+ZTnon3M3SrRTgIau0yumD07G31jA09Rdg8XJ\nSegj9nsxqQNOOZSDnAYe2QsekWiqBTw+P/uuBjEk8iOb840xWALrEP3S6qYd\nvrjeL3QNh7X0PnHzzLRMbZiKKXKaHKF3ZJ1FBjGVmnZALTUcv40vCrlQlJiN\n/S3Ei95j8cAxRmb9bFmPIvhNfFqw9sPck6jSrt9wCZWZI41vKYugcRvrafOT\n4SERVk8Ltx1sSSM753JTzkzr4s2czUsFFd8VBspWlJdoKWpr7azqHeLMOM+2\n3FsqtBEDUoOBytiDF2W8mAeakqKl3rWmxA+FI9V24EtBbhUFKuw5mPIf5hhn\nUwqn\r\n=+aA9\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIDZ76yY0bmM83iDBu1gj0gxBdsxgOpGt5tuVzSQbIt9wAiBU6Dh+M8DUSyrDylpdiWukjRyMX9O7JbAcQlO5sQuw8A=="}]},"_npmUser":{"name":"elefantling","email":"elefantling@gmail.com"},"directories":{},"maintainers":[{"name":"elefantling","email":"elefantling@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/ngx-load_0.0.1_1623182398477_0.2186811543962408"},"_hasShrinkwrap":false},"0.0.2":{"name":"@elefantling/ngx-load","version":"0.0.2","peerDependencies":{"@angular/common":"^15.0.0"},"dependencies":{"@angular/core":"^15.0.0","tslib":"^2.3.0","rxjs":"~7.5.0"},"description":"`*ngxLoad` is a structural directive that works a bit like combining `*ngIf` with the `async`-Pipe and providing some advanced features along the way.","_id":"@elefantling/ngx-load@0.0.2","_nodeVersion":"19.8.1","_npmVersion":"7.11.0","dist":{"integrity":"sha512-e4z8HVIeJKiD5LhuuiqNcMv6fl1b935CqPcpP4E64kJxZtokPMCKpLaByZxT+igeej/SEDMN3iLt4sKcdP0Y0Q==","shasum":"47e360ec58d80bf2d5b1141e480057ccad7c84b1","tarball":"https://registry.npmjs.org/@elefantling/ngx-load/-/ngx-load-0.0.2.tgz","fileCount":13,"unpackedSize":14719,"signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQCy0oBNYIphuSPsxn5nlSewy4uPexlvRhkKKPt0lhxwfwIgLTTlY+qRVWDVnCl/ICLNyxPXa9x3SMtIV6D2HcLwJ4E="}]},"_npmUser":{"name":"elefantling","email":"elefantling@gmail.com"},"directories":{},"maintainers":[{"name":"elefantling","email":"elefantling@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/ngx-load_0.0.2_1683574168228_0.8182711176016007"},"_hasShrinkwrap":false},"0.0.3":{"name":"@elefantling/ngx-load","version":"0.0.3","peerDependencies":{"@angular/common":"^15.0.0","@angular/core":"^15.0.0","rxjs":"~7.5.0"},"module":"fesm2015/elefantling-ngx-load.mjs","es2020":"fesm2020/elefantling-ngx-load.mjs","esm2020":"esm2020/elefantling-ngx-load.mjs","fesm2020":"fesm2020/elefantling-ngx-load.mjs","fesm2015":"fesm2015/elefantling-ngx-load.mjs","typings":"index.d.ts","exports":{"./package.json":{"default":"./package.json"},".":{"types":"./index.d.ts","esm2020":"./esm2020/elefantling-ngx-load.mjs","es2020":"./fesm2020/elefantling-ngx-load.mjs","es2015":"./fesm2015/elefantling-ngx-load.mjs","node":"./fesm2015/elefantling-ngx-load.mjs","default":"./fesm2020/elefantling-ngx-load.mjs"}},"sideEffects":false,"dependencies":{"tslib":"^2.3.0"},"description":"`*ngxLoad` is a structural directive that works a bit like combining `*ngIf` with the `async`-Pipe and providing some advanced features along the way.","_id":"@elefantling/ngx-load@0.0.3","_nodeVersion":"19.8.1","_npmVersion":"7.11.0","dist":{"integrity":"sha512-uOHGm5KR3lFfjlpe/71mtz1VVAz5PkfAXahxUgK2q1SgqUjlNWQfz1Y0isQV6zrz9TvmfD4KHVKYsy5R6AKyaw==","shasum":"38060e210e94346aa397de5bff1444161d7a57e5","tarball":"https://registry.npmjs.org/@elefantling/ngx-load/-/ngx-load-0.0.3.tgz","fileCount":20,"unpackedSize":88440,"signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIA2sQIn431rY66SXo0TXAmmFG9dherInrexlFAGYxjDzAiEAqDc9+uXldztvy5hOlYxwG5+tDKGc4tZyyWt/NIuBTcs="}]},"_npmUser":{"name":"elefantling","email":"elefantling@gmail.com"},"directories":{},"maintainers":[{"name":"elefantling","email":"elefantling@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/ngx-load_0.0.3_1683574758420_0.6681075105867063"},"_hasShrinkwrap":false}},"time":{"created":"2021-06-08T19:59:58.419Z","0.0.1":"2021-06-08T19:59:58.627Z","modified":"2023-05-08T19:39:18.731Z","0.0.2":"2023-05-08T19:29:28.379Z","0.0.3":"2023-05-08T19:39:18.630Z"},"maintainers":[{"name":"elefantling","email":"elefantling@gmail.com"}],"description":"`*ngxLoad` is a structural directive that works a bit like combining `*ngIf` with the `async`-Pipe and providing some advanced features along the way.","readme":"# ngx-load\n`*ngxLoad` is a structural directive that works a bit like combining `*ngIf` with the `async`-Pipe and providing some advanced features along the way.\n\n## Demo\nTry the Demo at [here](https://elefantling.github.io/ngx-load#demo).\n## States\nA variable holding an observable can be in serveral states:\n- **idle**: `observable$` is not set\n- **pending**: `observable$` is set, but has not emitted a value yet\n- **empty**: `observable$` is set, has emitted a value, but the value was empty (something like `0`, `''`, `[]` or `{}`)\n- **value**: `observable$` is set, and has emitted a value\n- **error**: `observable$` is set, and has thrown an error\n- **complete**: `observable$` is set, and has completed\n\n## Usage\n\n### Minimal example\n```html\n<div *ngxLoad=\"observable$; let content\">\n  <!-- this will be shown after observable$ emitted a any value -->\n  value: {{ content }}\n</div>\n```\nThis will display nothing until the observable emitted a value. For comparision using `*ngIf`:\n```html\n<div *ngIf=\"observable$ | async as content\">\n  value: {{ content }}\n</div>\n```\nNote that `*ngIf` will not show the value if `content` is actually `false` (or `0` or whatever is deemed false in Javascript 🤣).\n\n### Complete example\nWhen more templates are provided, more states will be displayed differently.\n```html\n<div *ngxLoad=\"observable$; empty: emptyTemplate; error: errorTemplate;  idle: idleTemplate;  pending: pendingTemplate; complete: completeTemplate; let content\" >\n  <!-- this will be shown after observable$ emitted a non-empty value -->\n  value: {{ content }}\n</div>\n<ng-template #idleTemplate>\n  <!-- this will be shown when observable$ is null (or undefined) -->\n  idle\n</ng-template>\n<ng-template #pendingTemplate>\n  <!-- this will be shown when observable$ is set, but no value was emitted -->\n  pending\n</ng-template>\n<ng-template #emptyTemplate>\n  <!-- this will be shown after observable$ emitted an empty value -->\n  empty\n</ng-template>\n<ng-template #errorTemplate let-content>\n  <!-- this will be shown after observable$ threw an error -->\n  error: {{ content }}\n</ng-template>\n<ng-template #completeTemplate>\n  <!-- this will be shown after the observable$ completed -->\n  complete\n</ng-template>\n```\n\n###\n","readmeFilename":"README.md"}