{"id":17025521,"url":"https://github.com/dsebastien/regform","last_synced_at":"2026-01-20T11:32:20.605Z","repository":{"id":143238524,"uuid":"46961105","full_name":"dsebastien/regForm","owner":"dsebastien","description":"Simple app that integrates Angular 2 and Material Design Lite","archived":false,"fork":false,"pushed_at":"2018-06-02T17:12:45.000Z","size":1498,"stargazers_count":0,"open_issues_count":180,"forks_count":0,"subscribers_count":2,"default_branch":"master","last_synced_at":"2025-04-07T14:28:29.833Z","etag":null,"topics":["angular","material","material-design"],"latest_commit_sha":null,"homepage":null,"language":"PHP","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/dsebastien.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE.MD","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2015-11-27T05:20:21.000Z","updated_at":"2017-11-10T09:12:41.000Z","dependencies_parsed_at":"2023-05-25T16:31:00.237Z","dependency_job_id":null,"html_url":"https://github.com/dsebastien/regForm","commit_stats":null,"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"purl":"pkg:github/dsebastien/regForm","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/dsebastien%2FregForm","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/dsebastien%2FregForm/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/dsebastien%2FregForm/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/dsebastien%2FregForm/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/dsebastien","download_url":"https://codeload.github.com/dsebastien/regForm/tar.gz/refs/heads/master","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/dsebastien%2FregForm/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":286080680,"owners_count":28602458,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2026-01-20T10:46:13.255Z","status":"ssl_error","status_checked_at":"2026-01-20T10:42:51.865Z","response_time":117,"last_error":"SSL_read: unexpected eof while reading","robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":false,"can_crawl_api":true,"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","material","material-design"],"created_at":"2024-10-14T07:29:24.371Z","updated_at":"2026-01-20T11:32:20.588Z","avatar_url":"https://github.com/dsebastien.png","language":"PHP","funding_links":[],"categories":[],"sub_categories":[],"readme":"# regform\n\n## About\nRegistration form is a simple proof of concept to integrate Angular 2 and Material Design Lite.\n\nThis project was created using the [ModernWebDev Yeoman Generator](https://github.com/dsebastien/modernWebDevGenerator) by [dSebastien](https://twitter.com/dSebastien).\n\n## Material Design Lite integration\nWhen Angular 2 instanciates the views (i.e., parses the templates and generates new DOM elements), the generated DOM elements corresponding to Material Design Lite elements are not 'registered'. That step is necessary so that the JavaScript part of Material Design Lite can work for those components.\n\nThis is described here: http://www.getmdl.io/started/index.html#dynamic.\n\nIn order to make this work, there are multiple options that all involve the componentHandler, which is a global object added by Material Design Lite when it loads.\n\nIn this project I'm trying out the different options; so far:\n* function scheduled with setInterval after the boostrap of the Angular 2 appl that uses the [MutationObserver](https://developer.mozilla.org/en/docs/Web/API/MutationObserver) API to be notified of DOM changes and calls `componentHandler.upgradeDom()` when needed\n* @Directive to manually attach to each Material Design Lite component that takes care of the registration using `componentHandler.upgradeElement(htmlElement)`\n\nThere are more options to try out though:\n* an `afterViewInit` hook\n* a custom decorator that does this for all components (could be more effective and less intrusive)\n* another solution that could do this globally with the least effort\n* ...\n\nI've taken some inspiration from: https://github.com/jadjoubran/angular-material-design-lite\n\n\n## How to build\nFirst, make sure that you have installed the required global npm packages: `npm install gulp --global --no-optional`.\n\nNext, if you have used the `--skip-install` option, then you also need to install the project dependencies using `npm run setup`.\n\nFor more details about the build, refer to the [ModernWebDevBuild](https://github.com/dsebastien/modernWebDevBuild) project documentation.\n\n## Jetbrains love\nWe're supported by [Jetbrains](https://www.jetbrains.com) and their awesome [support for open source](https://www.jetbrains.com/buy/opensource/), thanks to which we are able to use the best products on the market to work on this open source project!\n\n\u003ca href=\"https://www.jetbrains.com\"\u003e\u003cimg src=\"http://www.underconsideration.com/brandnew/archives/jetbrains_logo_detail.jpg\" width=\"144px\"\u003e\u003c/a\u003e\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fdsebastien%2Fregform","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fdsebastien%2Fregform","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fdsebastien%2Fregform/lists"}