Angular Material - Setting up with the CDN in angular material - Angular Material Tutorial
Setting up with the CDN in angular material
In the index.html, link the CSS from Google CDN
<link rel="stylesheet" href="https://ajax.googleapis.com/ajax/libs/angular_material/1.1.1/angular-material.min.css">Clicking "Copy Code" button will copy the code into the clipboard - memory. Please paste(Ctrl+V) it in your destination. The code will get pasted. Happy coding from Wikitechy angular material tutorial , angular 4 material , angular material2 , angular material example team
Required dependencies:
angular
angular-aria
angular-animate
angular-messagesClicking "Copy Code" button will copy the code into the clipboard - memory. Please paste(Ctrl+V) it in your destination. The code will get pasted. Happy coding from Wikitechy angular material tutorial , angular 4 material , angular material2 , angular material example team
<!-- Angular Material requires Angular.js Libraries -->
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.5/angular.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.5/angular-animate.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.5/angular-aria.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.5/angular-messages.min.js"></script>
<!-- Angular Material Library -->
<script src="https://ajax.googleapis.com/ajax/libs/angular_material/1.1.0/angular-material.min.js"></script>Clicking "Copy Code" button will copy the code into the clipboard - memory. Please paste(Ctrl+V) it in your destination. The code will get pasted. Happy coding from Wikitechy angular material tutorial , angular 4 material , angular material2 , angular material example team
index.html:
<!DOCTYPE html>
<html ng-app="angularMaterial">
<head>
<link rel="stylesheet"href="https://ajax.googleapis.com/ajax/libs/angular_material/1.1.1/angular-material.min.css">
<!-- Angular Material requires Angular.js Libraries -->
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.8/angular.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.8/angular-animate.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.8/angular-aria.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.8/angular-messages.min.js"></script>
<!-- Angular Material Library -->
<script src="https://ajax.googleapis.com/ajax/libs/angular_material/1.1.1/angular-material.min.js"></script>
<script src="app.js"></script>
<title>Angular Material</title>
</head>
<body ng-controller="MainController">
<md-content>{{content}}</md-content>
</body>
</html>Clicking "Copy Code" button will copy the code into the clipboard - memory. Please paste(Ctrl+V) it in your destination. The code will get pasted. Happy coding from Wikitechy angular material tutorial , angular 4 material , angular material2 , angular material example team
app.js:
angular.module('angularMaterial', ['ngAnimate', 'ngAria', 'ngMaterial', 'ngMessages'])
.controller('MainController', function($scope) {
$scope.content = "Your content goes here.";
})