{"id":14973342,"url":"https://github.com/jokade/angulate2","last_synced_at":"2025-10-27T01:30:30.353Z","repository":{"id":31859796,"uuid":"35427462","full_name":"jokade/angulate2","owner":"jokade","description":"Scala.js bindings for Angular","archived":false,"fork":false,"pushed_at":"2017-10-29T09:22:32.000Z","size":223,"stargazers_count":87,"open_issues_count":20,"forks_count":15,"subscribers_count":15,"default_branch":"master","last_synced_at":"2025-02-01T01:24:42.934Z","etag":null,"topics":["angular-2","scala-js","scalajs"],"latest_commit_sha":null,"homepage":"","language":"Scala","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/jokade.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2015-05-11T14:00:48.000Z","updated_at":"2021-08-17T15:35:26.000Z","dependencies_parsed_at":"2022-07-08T01:20:49.335Z","dependency_job_id":null,"html_url":"https://github.com/jokade/angulate2","commit_stats":null,"previous_names":[],"tags_count":6,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/jokade%2Fangulate2","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/jokade%2Fangulate2/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/jokade%2Fangulate2/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/jokade%2Fangulate2/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/jokade","download_url":"https://codeload.github.com/jokade/angulate2/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":238418210,"owners_count":19468865,"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-2","scala-js","scalajs"],"created_at":"2024-09-24T13:48:34.954Z","updated_at":"2025-10-27T01:30:30.044Z","avatar_url":"https://github.com/jokade.png","language":"Scala","funding_links":[],"categories":[],"sub_categories":[],"readme":"angulate2\n===========\n[![Gitter](https://badges.gitter.im/Join%20Chat.svg)](https://gitter.im/angulate2/Lobby)\n[![Scala.js](https://www.scala-js.org/assets/badges/scalajs-0.6.17.svg)](https://www.scala-js.org)\n\u003c!--[![Build Status](https://travis-ci.org/jokade/angulate2.svg?branch=master)](https://travis-ci.org/jokade/angulate2)--\u003e\n\n[Scala.js](http://www.scala-js.org/) bindings for [Angular](http://www.angular.io). The goal is to provide an API/ experience very similar to the [TypeScript API](https://angular.io/docs/ts/latest/guide/cheatsheet.html) of Angular.\n\n**IMPORTANT: angulate2 currently only supports Scala 2.11.x**\n\nA basic [Quickstart Example](https://github.com/jokade/angulate2-quickstart) that may serve as template is available, as well as set of **[extended examples](https://github.com/jokade/angulate2-examples)**.\n\n**[Release Notes](https://github.com/jokade/angulate2/wiki/Release-Notes)**\n\nGetting Started\n---------------\n### SBT settings\nAdd the following lines to your `project/plugins.sbt`:\n```scala\naddSbtPlugin(\"de.surfice\" % \"sbt-angulate2\" % \"0.1.0-RC1\")\n```\nand this to your `build.sbt`:\n```scala\nenablePlugins(Angulate2Plugin)\n\nngBootstrap := Some(\"AppModule\") //qualified name (including packages) of Scala class to bootstrap\n```\nThe current version of angulate2 is built for Angular 4 and Scala.js 0.6.18.\n\n### Create application module and component\n```scala\nimport angulate2.std._\nimport angulate2.platformBrowser.BrowserModule\n\n@NgModule(\n  imports = @@[BrowserModule],\n  declarations = @@[AppComponent],\n  bootstrap = @@[AppComponent]\n)\nclass AppModule {}\n\n@Component(\n  selector = \"my-app\",\n  template = \"\u003ch1\u003e{{greeting}}\u003c/h1\u003e\n}\nclass AppComponent {\n  val greeting = \"Hello Angular!\"\n}\n```\n\n### Build and run with System.js\nWith the above configuration, a separate JS file `PROJECT-sjsx.js` is written to `target/scala-2.11/` every time you run `fastOptJS` or `fullOptJS`. This file contains the class decorators generated from Angular2 annotations (@Component, ...) and represents the entry module of your Angular application. The annotations file loads the Scala.js package and all Angular libraries via `require`, so you need to load the annotations file with a module loader. \n\nOne way to achieve this is to use (System.js)[https://github.com/systemjs/systemjs]. The angulate2 sbt plugin provides some tasks to simplify the creation of the System.js configuration, and for running (lite-server)[https://github.com/johnpapa/lite-server]. Although you can build your angulate2 project without Node.js, some of these tasks require a Node.js installation, so make sure `npm` and `node` are in your `PATH` before you proceed.\n\n#### Add the HTML index\nCreate `src/main/resources/index-fastopt.html` with the following content:\n```html\n\u003chtml\u003e\n  \u003chead\u003e\n    \u003ctitle\u003eAngulate2 QuickStart\u003c/title\u003e\n    \u003cmeta charset=\"UTF-8\"\u003e\n    \u003cmeta name=\"viewport\" content=\"width=device-width, initial-scale=1\"\u003e\n    \u003c!-- \u003clink rel=\"stylesheet\" href=\"styles.css\"\u003e --\u003e\n    \u003c!-- 1. Load libraries --\u003e\n    \u003c!-- Polyfill for older browsers --\u003e\n    \u003cscript src=\"node_modules/core-js/client/shim.min.js\"\u003e\u003c/script\u003e\n    \u003cscript src=\"node_modules/zone.js/dist/zone.js\"\u003e\u003c/script\u003e\n    \u003cscript src=\"node_modules/reflect-metadata/Reflect.js\"\u003e\u003c/script\u003e\n    \u003cscript src=\"node_modules/systemjs/dist/system.src.js\"\u003e\u003c/script\u003e\n    \u003c!-- 2. Configure SystemJS --\u003e\n    \u003cscript src=\"systemjs-fastopt.config.js\"\u003e\u003c/script\u003e\n    \u003cscript\u003e\n      System.import('app').catch(function(err){ console.error(err); });\n    \u003c/script\u003e\n  \u003c/head\u003e\n  \u003c!-- 3. Display the application --\u003e\n  \u003cbody\u003e\n    \u003cmy-app\u003eLoading...\u003c/my-app\u003e\n  \u003c/body\u003e\n\u003c/html\u003e\n```\n\n#### Create the System.js configuration \nMost of the settings required for System.js config file are pre-configured by the angulate2 sbt plugin; however, you need to add the following System.js module mappings to your `build.sbt`:\n```scala\n    systemJSMappings in fastOptJS ++= Seq(\n      \"@angular/core\"                     -\u003e \"npm:@angular/core/bundles/core.umd.js\",\n      \"@angular/common\"                   -\u003e \"npm:@angular/common/bundles/common.umd.js\",\n      \"@angular/compiler\"                 -\u003e \"npm:@angular/compiler/bundles/compiler.umd.js\",\n      \"@angular/platform-browser\"         -\u003e \"npm:@angular/platform-browser/bundles/platform-browser.umd.js\",\n      \"@angular/platform-browser-dynamic\" -\u003e \"npm:@angular/platform-browser-dynamic/bundles/platform-browser-dynamic.umd.js\",\n      \"@angular/http\"                     -\u003e \"npm:@angular/http/bundles/http.umd.js\",\n      \"@angular/router\"                   -\u003e \"npm:@angular/router/bundles/router.umd.js\",\n      \"@angular/forms\"                    -\u003e \"npm:@angular/forms/bundles/forms.umd.js\",\n      \"@angular/upgrade\"                  -\u003e \"npm:@angular/upgrade/bundles/upgrade.umd.js\",\n      \"rxjs\"                              -\u003e \"npm:rxjs\"\n    )\n```\n\nthen run `sbt fastOptJS::systemJS`. This creates the System.js configuration at `target/scala-2.11/systemjs-fastopt.config.js`.\n\n#### Create lite-server configuration\nNext run `sbt fastOptJS::liteServerWriteConfigFile`. This will install all required npm dependencies (which may take some time), copy your `index-fastopt.html` to `target/scala-2.11/`, and create `bs-config-fastopt.json` (the lite-server configuration).\n\n#### Compile and run project\nRun `sbt fastOptJS`; this will build the Scala.js application file (`angulate2-quickstart-fastopt.js`) and the corresponding decorator file (`angulate2-quickstart-sjsx.js`). To run you project, start\n```bash\n$ node_modules/lite-server/bin/lite-server --config=target/scala-2.11/bs-config-fastopt.json\n```\nfrom your shell, and point your browser to `http://localhost:3000/index-fastopt.html`.\n\n### Bundle the application with webpack\nTBD\n\nLicense\n-------\nThis code is open source software licensed under the [MIT License](http://opensource.org/licenses/MIT).\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fjokade%2Fangulate2","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fjokade%2Fangulate2","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fjokade%2Fangulate2/lists"}