{"id":19977946,"url":"https://github.com/devbyray/angularjs-routing-setup","last_synced_at":"2026-04-18T12:33:38.536Z","repository":{"id":30957936,"uuid":"34516067","full_name":"devbyray/angularjs-routing-setup","owner":"devbyray","description":"How to start an AngularJS routing app","archived":false,"fork":false,"pushed_at":"2015-04-24T15:11:19.000Z","size":232,"stargazers_count":0,"open_issues_count":0,"forks_count":0,"subscribers_count":2,"default_branch":"master","last_synced_at":"2025-03-01T19:15:18.488Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":"","language":"CSS","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/devbyray.png","metadata":{"files":{"readme":"readme.md","changelog":null,"contributing":null,"funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2015-04-24T11:56:50.000Z","updated_at":"2015-04-24T15:10:42.000Z","dependencies_parsed_at":"2022-09-08T16:20:28.834Z","dependency_job_id":null,"html_url":"https://github.com/devbyray/angularjs-routing-setup","commit_stats":null,"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"purl":"pkg:github/devbyray/angularjs-routing-setup","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/devbyray%2Fangularjs-routing-setup","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/devbyray%2Fangularjs-routing-setup/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/devbyray%2Fangularjs-routing-setup/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/devbyray%2Fangularjs-routing-setup/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/devbyray","download_url":"https://codeload.github.com/devbyray/angularjs-routing-setup/tar.gz/refs/heads/master","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/devbyray%2Fangularjs-routing-setup/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":286080680,"owners_count":31969762,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2026-04-18T00:39:45.007Z","status":"online","status_checked_at":"2026-04-18T02:00:07.018Z","response_time":103,"last_error":null,"robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":true,"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":[],"created_at":"2024-11-13T03:29:51.291Z","updated_at":"2026-04-18T12:33:38.506Z","avatar_url":"https://github.com/devbyray.png","language":"CSS","funding_links":[],"categories":[],"sub_categories":[],"readme":"# Angular routing Setup\n\n## Project structure:\n- app\n    - src\n        - js\n            - libs\n                - angular.min.js\n            - app.js\n        -sass\n            - sass-structure\n    - index.html\n- gulpfile.js\n- package.json\n- readme.md\n\n## How to install\n\n1. run `(sudo) npm install`\n2. run `gulp`\n3. Then go to the browser and paste: \"http://localhost:3000/\".\n\n## How to start an AngularJS routing app\n\nIn this example I already did the setup. But the most important things to do is:\n\nBefore you start, checkout this repo first: [How to start an AngularJS app](https://github.com/raymonschouwenaar/angularjs-first-setup)\n\n1. Now include the ngRoute script in your html: [ngRoute source](https://code.angularjs.org/1.3.9/angular-route.js)\n2. Give your application a name, in the app.js (`var ngRouteApp = angular.module(\"ngRouteApp\", ['ngRoute']);`) \u0026 html (`\u003chtml ng-app=\"ngRouteApp\"\u003e`). Be carfull that the name inside the angular.module(\"appName\") is the same as the name inside the html ng-app.\n3. Add a several html file in the \"views\" folder. Like home.html, about.html \u0026 contact.html.\n4. In the app.js we need to create a routeProvider, to let the routes show the right content:\n\u003ccode\u003e\u003cpre\u003e\nngRouteApp.config(function($routeProvider, $locationProvider) {\n    $routeProvider\n        .when('/', {\n            templateUrl: '../views/home.html'\n        })\n        .when('/home', {\n            redirectTo: '/'\n        })\n        .when('/about', {\n            templateUrl: '../views/about.html'\n        })\n        .when('/contact', {\n            templateUrl: '../views/contact.html'\n        })\n        .otherwise({\n            redirectTo: '/'\n        });\n});\n\u003c/pre\u003e\u003c/code\u003e\n5. Now add `\u003cng-view\u003e\u003c/ng-view\u003e` to the place where the views content needs to be shown.\n6. Now if you add home after the url, you will go to the root. When adding about, you see the about content.\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fdevbyray%2Fangularjs-routing-setup","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fdevbyray%2Fangularjs-routing-setup","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fdevbyray%2Fangularjs-routing-setup/lists"}