{"id":21068726,"url":"https://github.com/yuxblank/rngdynamics","last_synced_at":"2025-03-14T02:22:44.364Z","repository":{"id":143801746,"uuid":"382870525","full_name":"yuxblank/RNgDynamics","owner":"yuxblank","description":"Angular Dynamic modules and components @runtime!","archived":false,"fork":false,"pushed_at":"2021-07-11T11:14:09.000Z","size":192,"stargazers_count":1,"open_issues_count":0,"forks_count":0,"subscribers_count":1,"default_branch":"master","last_synced_at":"2025-01-20T21:39:06.431Z","etag":null,"topics":["angular","dynamic","lazy-loading","modules"],"latest_commit_sha":null,"homepage":"","language":"TypeScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/yuxblank.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":"CONTRIBUTING.md","funding":null,"license":"LICENSE.md","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null}},"created_at":"2021-07-04T14:21:36.000Z","updated_at":"2024-05-18T17:11:25.000Z","dependencies_parsed_at":null,"dependency_job_id":"c46ce26a-469c-4990-99fa-4616a77309be","html_url":"https://github.com/yuxblank/RNgDynamics","commit_stats":{"total_commits":23,"total_committers":2,"mean_commits":11.5,"dds":0.04347826086956519,"last_synced_commit":"9d45ff89cf8a52bf03055b9b13da6b30e81ed29d"},"previous_names":[],"tags_count":2,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/yuxblank%2FRNgDynamics","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/yuxblank%2FRNgDynamics/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/yuxblank%2FRNgDynamics/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/yuxblank%2FRNgDynamics/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/yuxblank","download_url":"https://codeload.github.com/yuxblank/RNgDynamics/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":243510056,"owners_count":20302296,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["angular","dynamic","lazy-loading","modules"],"created_at":"2024-11-19T18:24:21.313Z","updated_at":"2025-03-14T02:22:44.321Z","avatar_url":"https://github.com/yuxblank.png","language":"TypeScript","readme":"[![Coverage Status](https://coveralls.io/repos/github/yuxblank/RNgDynamics/badge.svg?branch=master\u0026kill_cache=1)](https://coveralls.io/github/yuxblank/RNgDynamics?branch=master\u0026kill_cache=1)\n\n# RNgDynamics\nRNgDynamics is library for consuming Modules dynamically within your Angular Applications.\n\nThe library allows loading `@NgModule`'s at runtime using the Angular JIT compiler with straightforward api configuring the lazy loaded modules and components.\n\nAngular only supports by default lazy loading from the Router, with RNgDynamics components can be loaded lazily by your application code.\n\nLazy loaded components can be projected by the built-in directive `rngLazyLoaded` that act's as proxy for dynamic module components.\n\nA lazy loaded module once loaded is cached in memory, so the application will not load it twice.\n\n\n## Features\n\n- Lazy load modules and components without Angular Router\n- Project lazy loaded components using a simple directive `rngLazyLoaded`\n- Modules and components are cached in memory (optionally Module Factories can be non-cached)\n- Load lazy components by type or by a named key string you define\n- Create endlessly lazy-loading capabilities in your Angular applications and libraries by wiring your own lazy loading logic\n\n\n## Usage\n\nFirst of all create a Module to be lazy loaded without importing it into the others modules or RootModule.\n\nThen define the `RNgDynamicModuleDef` for your module to be registered within RNgDynamics as follows:\n```typescript\nconst RNG_DYNAMICS : RNgDynamicModules\u003cLazyModule\u003e = [\n  {\n    components: {lazyComponent: LazyComponent}, // all the components associated with the Module\n    import: () =\u003e import(\"./lazy/lazy.module\").then(m =\u003e m.LazyModule) // use import and resolve the module type\n  }\n]\n```\n\nThen register the `RNgDynamicModules\u003cT\u003e` array to the `RNgDynamicModule` using the `forRoot` method.\n \n```typescript\n@NgModule({\n  declarations: [AppComponent],\n  imports: [\n    CommonModule,\n    BrowserModule,\n    RNgLoggerModule,\n    RNgDynamicModule.forRoot(RNG_DYNAMICS) // register dynamics\n  ],\n  providers: [],\n  bootstrap: [AppComponent]\n})\nexport class AppModule {}\n```\n\nYou can use the `RNgDynamicModule.forRoot` in any module multiple times, the configurations are compacted by the library.\n\nNow just define an element you want to proxy in your Components, as follows:\n\n```html\n \u003cng-container rngLazyLoaded=\"lazyComponent\"\u003e\u003c/ng-container\u003e\n```\n\nor by supplying the type:\n```typescript\n@Component({\n    selector: \"my-component\",\n    template: `\u003cng-container [rngLazyLoaded]=\"myLazyComp\"\u003e\u003c/ng-container\u003e`\n})\nexport class MyComponent {\n    myLazyComp = LazyComponent\n}\n```\n\n*That's enough, your LazyComponent is ready to be lazy-loaded!*\n\n\n## Known Limitations\nActually the library only supports lazy loading from modules available at build time using the loading callback:\n\n```typescript\nimport(\"./folder/MyModule.ts\").then(m =\u003e m.MyModule)\n```\n\n_The plan is to support loading modules not available at build time in the future._\n\n","funding_links":[],"categories":[],"sub_categories":[],"project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fyuxblank%2Frngdynamics","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fyuxblank%2Frngdynamics","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fyuxblank%2Frngdynamics/lists"}