AngularJS 模块路由 material 设计 CSS 问题
AngularJS module routing with material design CSS issue
我将尝试在 angular js 中将 material 设计与路由集成,但 CSS 设计不起作用。如果我将使用 bootstrap CSS 检查,它正在工作。
如果我尝试这种方式,它会给我这样的错误
var scotchApp = angular.module('scotchApp', ['ngMaterial']);
错误
Uncaught Error: [$injector:modulerr]
http://errors.angularjs.org/1.2.25/$injector/modulerr?p0=scotchApp&p1=Error…gleapis.com%2Fajax%2Flibs%2Fangularjs%2F1.2.25%2Fangular.min.js%3A18%3A170)
App.JS
// create the module and name it scotchApp
// also include ngRoute for all our routing needs
// var scotchApp = angular.module('scotchApp', ['ngMaterial']); -- Not Working
var scotchApp = angular.module('scotchApp', ['ngRoute']);
// configure our routes
scotchApp.config(function ($routeProvider) {
$routeProvider
// route for the home page
.when('/', {
templateUrl: 'pages/home.html',
controller: 'mainController'
})
// route for the about page
.when('/about', {
templateUrl: 'pages/about.html',
controller: 'aboutController'
})
// route for the contact page
.when('/contact', {
templateUrl: 'pages/contact.html',
controller: 'contactController'
});
});
// create the controller and inject Angular's $scope
scotchApp.controller('mainController', function ($scope) {
// create a message to display in our view
$scope.message = 'Everyone come and see how good I look!';
});
scotchApp.controller('aboutController', function ($scope) {
$scope.message = 'Look! I am an about page.';
});
scotchApp.controller('contactController', function ($scope) {
$scope.message = 'Contact us! JK. This is just a demo.';
});
我尝试了很多方法我不知道为什么 CSS 不起作用。
偶数控制台没有报错
为什么 CSS 不起作用?
开始于:
var scotchApp = angular.module('scotchApp', ['ngRoute', 'ngMaterial']);
然后使用较新版本的angular和其他依赖项(它们应该是相同的)。
将其与:http://plnkr.co/edit/rma0UFOGbtg1WMW6BbvV?p=preview 进行比较,有效。
我也将你的 js 引用移到了正文的末尾,并将 'ngMaterial' 注入到你的应用程序模块中。
如您所见,md-button
指令有效。
我将尝试在 angular js 中将 material 设计与路由集成,但 CSS 设计不起作用。如果我将使用 bootstrap CSS 检查,它正在工作。
如果我尝试这种方式,它会给我这样的错误
var scotchApp = angular.module('scotchApp', ['ngMaterial']);
错误
Uncaught Error: [$injector:modulerr] http://errors.angularjs.org/1.2.25/$injector/modulerr?p0=scotchApp&p1=Error…gleapis.com%2Fajax%2Flibs%2Fangularjs%2F1.2.25%2Fangular.min.js%3A18%3A170)
App.JS
// create the module and name it scotchApp
// also include ngRoute for all our routing needs
// var scotchApp = angular.module('scotchApp', ['ngMaterial']); -- Not Working
var scotchApp = angular.module('scotchApp', ['ngRoute']);
// configure our routes
scotchApp.config(function ($routeProvider) {
$routeProvider
// route for the home page
.when('/', {
templateUrl: 'pages/home.html',
controller: 'mainController'
})
// route for the about page
.when('/about', {
templateUrl: 'pages/about.html',
controller: 'aboutController'
})
// route for the contact page
.when('/contact', {
templateUrl: 'pages/contact.html',
controller: 'contactController'
});
});
// create the controller and inject Angular's $scope
scotchApp.controller('mainController', function ($scope) {
// create a message to display in our view
$scope.message = 'Everyone come and see how good I look!';
});
scotchApp.controller('aboutController', function ($scope) {
$scope.message = 'Look! I am an about page.';
});
scotchApp.controller('contactController', function ($scope) {
$scope.message = 'Contact us! JK. This is just a demo.';
});
我尝试了很多方法我不知道为什么 CSS 不起作用。
偶数控制台没有报错
为什么 CSS 不起作用?
开始于:
var scotchApp = angular.module('scotchApp', ['ngRoute', 'ngMaterial']);
然后使用较新版本的angular和其他依赖项(它们应该是相同的)。
将其与:http://plnkr.co/edit/rma0UFOGbtg1WMW6BbvV?p=preview 进行比较,有效。
我也将你的 js 引用移到了正文的末尾,并将 'ngMaterial' 注入到你的应用程序模块中。
如您所见,md-button
指令有效。