1
http://plnkr.co/edit/Lvdl4XpReQr6AzsuOQhP?p=preview각도 재료 작동하지 AngularJS와
각 재료 다음과 같은 오류가 발생을 사용하는 동안 : catch되지 않은 오류 : [$ 주입기 : unpr]? http://errors.angularjs.org/1.4.2/ $ 인젝터/unpr P0 = % 24 % 24forceReflowProvid ... eQueue %의 20 % 3C - % 20 % 24animate % 20 % 3C- % 20 % 24compile % 20 % 3C- % 20 % 24 % 24animateQueue
Routing.JS :
(function() {
var app = angular.module('angularMaterial', ['ngRoute','ngMaterial']);
app.config(function ($routeProvider) {
$routeProvider
.when("/main", {
templateUrl: 'main.html',
controller: 'MainController'
})
.otherwise({ redirectTo: "/main" });
});
}());
Index.html 것 : HTML 페이지를 표시하기위한 쉘 기반 라우팅 사용 중
<html lang="en" ng-app="angularMaterial">
<head>
<title>Angular Material Fundamentals</title>
<meta charset="utf-8" />
<link data-require="[email protected]*" data-semver="1.1.0" rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/angular_material/1.1.0/angular-material.min.css" />
<script data-require="[email protected]*" data-semver="1.1.0" src="http://ajax.googleapis.com/ajax/libs/angular_material/1.1.0/angular-material.min.js"></script>
<script data-require="[email protected]" data-semver="1.6.0" src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.0/angular.js"></script>
<script data-require="[email protected]*" data-semver="1.6.0" src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.0/angular-animate.js"></script>
<script data-require="[email protected]" data-semver="1.5.5" src="http://ajax.googleapis.com/ajax/libs/angularjs/1.5.5/angular-aria.min.js"></script>
<script data-require="[email protected]" data-semver="1.5.5" src="http://ajax.googleapis.com/ajax/libs/angularjs/1.5.5/angular-messages.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular-route.js"></script>
<script src="routing.js"></script>
<script src="MainController.js"></script>
</head>
<body ng-cloak="">
<header>
<h1>
Angular Material Fundamentals </h1>
</header>
<div ng-view=""></div>
</body>
</html>
Main.html :
<div>
<md-content flex layout-padding>
{{message}}
</md-content>
</div>
MainController.js :
function MainController($scope) {
$scope.message = "Angular Material is a UI component library for Angular JS developers. Angular Material components helps in constructing attractive, consistent, and functional web pages and web apps while adhering to modern web design principles like browser portability, device independence, and graceful degradation. It helps in creating faster, beautiful, and responsive websites. It is inspired from Google Material Design.";
}
MainController.$inject = ['$scope'];
angular.module('angularMaterial').controller('MainController', MainController);
이 도와주세요 ..... 감사합니다