{"id":15093153,"url":"https://github.com/angular/bower-material","last_synced_at":"2025-10-06T11:31:33.433Z","repository":{"id":19837746,"uuid":"23099295","full_name":"angular/bower-material","owner":"angular","description":"This repository is used for publishing the AngularJS Material v1.x library","archived":true,"fork":false,"pushed_at":"2022-04-11T19:23:23.000Z","size":248718,"stargazers_count":508,"open_issues_count":3,"forks_count":277,"subscribers_count":49,"default_branch":"master","last_synced_at":"2024-05-09T10:10:15.064Z","etag":null,"topics":["angularjs-libraries","angularjs-material","bower","modules","npm"],"latest_commit_sha":null,"homepage":"https://material.angularjs.org","language":"JavaScript","has_issues":false,"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/angular.png","metadata":{"files":{"readme":"README.md","changelog":"CHANGELOG.md","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":"2014-08-19T06:22:34.000Z","updated_at":"2024-02-26T17:10:17.000Z","dependencies_parsed_at":"2022-08-05T05:15:16.985Z","dependency_job_id":null,"html_url":"https://github.com/angular/bower-material","commit_stats":null,"previous_names":[],"tags_count":3673,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/angular%2Fbower-material","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/angular%2Fbower-material/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/angular%2Fbower-material/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/angular%2Fbower-material/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/angular","download_url":"https://codeload.github.com/angular/bower-material/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":219877267,"owners_count":16554853,"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":["angularjs-libraries","angularjs-material","bower","modules","npm"],"created_at":"2024-09-25T11:03:53.750Z","updated_at":"2025-10-06T11:31:27.732Z","avatar_url":"https://github.com/angular.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# AngularJS Material\n\n**[Support for legacy AngularJS ended on January 1st, 2022](https://goo.gle/angularjs-end-of-life).\n[See `@angular/core` for the actively supported Angular](https://npmjs.com/@angular/core).**\n\nSee the following, related, actively supported Angular packages:\n- [`@angular/material`](https://www.npmjs.com/package/@angular/material)\n- [`@angular/cdk`](https://www.npmjs.com/package/@angular/cdk)\n\nThis repository was used to publish the AngularJS Material v1.x library and localized installs\nusing `npm`. You can find the component source-code for this library in the\n[AngularJS Material repository](https://github.com/angular/material). This package and related repositories\nhave reached End-of-Life.\n\nAngularJS Material is an implementation of Google's\n[Material Design Specification (2014-2017)](https://material.io/archive/guidelines/material-design/)\nfor [AngularJS](https://angularjs.org) (v1.x) developers.\n\nFor an implementation of the [Material Design Specification (2018+)](https://material.io/design/),\nplease see the [Angular Material](https://material.angular.io/) project which is built for\n[Angular](https://angular.io) (v2+) developers.\n\n## Layouts and SCSS\n\nIncluded in this repository are the:\n\n* **[SCSS files](https://github.com/angular/bower-material/tree/master/modules/scss)** which are\nused to build the *.css files\n* **[Layout files](https://github.com/angular/bower-material/tree/master/modules/layouts)** which\nare used with the AngularJS Material (Flexbox) Layout API. \n\n\u003e Note these are already included in the `angular-material.css` files. These copies are for direct\ndeveloper access and contain IE flexbox fixes; as needed.\n\n## Installing AngularJS Material\n\nYou can install this package locally with `npm`. \n\n**Please note**: AngularJS Material requires **AngularJS 1.7.2** to **AngularJS 1.8.x**.\n\n```shell\n# To install latest formal release \nnpm install angular-material\n\n# To install latest release and update package.json\nnpm install angular-material --save\n\n# To install from HEAD of master\nnpm install http://github.com/angular/bower-material/tarball/master\n\n# or use alternate syntax to install HEAD from master\nnpm install http://github.com/angular/bower-material#master --save\n# note: ^^ creates the following package.json dependency\n#      \"angular-material\": \"git+ssh://git@github.com/angular/bower-material.git#master\"\n\n\n# To install the v1.2.1 version \nnpm install http://github.com/angular/bower-material/tarball/v1.2.1 --save\n\n# To view all installed package \nnpm list\n```\n\n## Using the AngularJS Material Library\n\nYou have installed the AngularJS library, next include the scripts and \nstylesheet in your main HTML file, in the order shown in the example below. Note that NPM \nwill install the files under `/node_modules/angular-material/`.\n\n```html\n\u003c!DOCTYPE html\u003e\n\u003chtml\u003e\n\u003chead\u003e\n  \u003cmeta name=\"viewport\" content=\"initial-scale=1, maximum-scale=1, user-scalable=no\" /\u003e\n  \u003clink rel=\"stylesheet\" href=\"/node_modules/angular-material/angular-material.css\"\u003e\n\u003c/head\u003e\n  \u003cbody ng-app=\"YourApp\"\u003e\n  \u003cdiv ng-controller=\"YourController\"\u003e\n\n  \u003c/div\u003e\n\n  \u003cscript src=\"/node_modules/angular/angular.js\"\u003e\u003c/script\u003e\n  \u003cscript src=\"/node_modules/angular-aria/angular-aria.js\"\u003e\u003c/script\u003e\n  \u003cscript src=\"/node_modules/angular-animate/angular-animate.js\"\u003e\u003c/script\u003e\n  \u003cscript src=\"/node_modules/angular-messages/angular-messages.js\"\u003e\u003c/script\u003e\n  \u003cscript src=\"/node_modules/angular-material/angular-material.js\"\u003e\u003c/script\u003e\n  \u003cscript\u003e\n    // Include app dependency on ngMaterial\n    angular.module('YourApp', ['ngMaterial', 'ngMessages'])\n      .controller(\"YourController\", YourController);\n  \u003c/script\u003e\n\u003c/body\u003e\n\u003c/html\u003e\n```\n\n## Using the CDN\n\nWith the Google CDN, you will not need to download local copies of the distribution files.\nInstead, reference the CDN URLs to use those remote library files. \nThis is especially useful when using online tools such as CodePen, Plunker, or jsFiddle.\n\n```html\n\u003chead\u003e\n    \u003c!-- Angular Material CSS now available via Google CDN; version 1.2.1 used here --\u003e\n    \u003clink rel=\"stylesheet\" href=\"https://ajax.googleapis.com/ajax/libs/angular_material/1.2.1/angular-material.min.css\"\u003e\n\u003c/head\u003e\n\u003cbody\u003e\n\n    \u003c!-- Angular Material Dependencies --\u003e\n    \u003cscript src=\"https://ajax.googleapis.com/ajax/libs/angularjs/1.8.2/angular.min.js\"\u003e\u003c/script\u003e\n    \u003cscript src=\"https://ajax.googleapis.com/ajax/libs/angularjs/1.8.2/angular-animate.min.js\"\u003e\u003c/script\u003e\n    \u003cscript src=\"https://ajax.googleapis.com/ajax/libs/angularjs/1.8.2/angular-aria.min.js\"\u003e\u003c/script\u003e\n    \u003cscript src=\"https://ajax.googleapis.com/ajax/libs/angularjs/1.8.2/angular-messages.min.js\"\u003e\u003c/script\u003e\n    \n    \u003c!-- Angular Material Javascript now available via Google CDN; version 1.2.1 used here --\u003e\n    \u003cscript src=\"https://ajax.googleapis.com/ajax/libs/angular_material/1.2.1/angular-material.min.js\"\u003e\u003c/script\u003e\n\u003c/body\u003e\n```\n\n\u003e Note that the above sample references the 1.2.1 CDN release. Your version will change \nbased on the latest stable release version.\n\n## Unit Testing with Angular Material\n\n\u003cbr/\u003e\nIf you are using AngularJS Material and will be using Jasmine to test your custom application\ncode, you will need to also load two (2) AngularJS mock files:\n\n*  AngularJS mocks\n    * **angular-mocks.js** from `/node_modules/angular-mocks/angular-mocks.js`\n*  AngularJS Material mocks\n    * **angular-material-mocks.js** from `/node_modules/angular-material/angular-material-mocks.js`\n\n\u003cbr/\u003e\n\nShown below is a karma-configuration file (`karma.conf.js`) sample that may be a useful template for\nyour testing purposes:\u003cbr/\u003e\u003cbr/\u003e\n\n```js\nmodule.exports = function(config) {\n\n  var SRC = [\n    'src/myApp/**/*.js',\n    'test/myApp/**/*.spec.js'\n  ];\n\n  var LIBS = [\n    'node_modules/angular/angular.js',\n    'node_modules/angular-animate/angular-animate.js',\n    'node_modules/angular-aria/angular-aria.js',\n    'node_modules/angular-messages/angular-messages.js',\n    'node_modules/angular-material/angular-material.js',\n    \n    'node_modules/angular-mocks/angular-mocks.js',\n    'node_modules/angular-material/angular-material-mocks.js'\n  ];\n\n  config.set({\n    basePath: __dirname + '/..',\n    frameworks: ['jasmine'],\n    \n    files: LIBS.concat(SRC),\n\n    port: 9876,\n    reporters: ['progress'],\n    colors: true,\n\n    autoWatch: false,\n    singleRun: true,\n    browsers: ['Chrome']\n  });\n};\n```\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fangular%2Fbower-material","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fangular%2Fbower-material","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fangular%2Fbower-material/lists"}