作者热门文章
- Java 双重比较
- java - 比较器与 Apache BeanComparator
- Objective-C 完成 block 导致额外的方法调用?
- database - RESTful URI 是否应该公开数据库主键?
嘿,所以我使用 routeProvider 和 ng-view 在 Angularjs 中的 View 之间进行路由。我的问题是当路线改变时我的 css 没有被加载。我尝试包含 Angular-css,以便 css 可以包含在每个 View 中,但它似乎不起作用。它在从 ng-view (home.html) 加载的第一个页面中加载,但是当我从那里链接到另一个页面时,css 停止加载。
index.html:
<!DOCTYPE html>
<html lang="en" ng-app="myApp">
<head>
<script src="app/lib/jquery-3.0.0.js"></script>
<link href="styles.css" rel="stylesheet" type="text/css" />
<script src="app/lib/angular.min.js"></script>
<script src="app/lib/angular-route.min.js"></script>
<script src="app/lib/angular-css.min.js"></script>
<script src="app/lib/app.js"></script>
</head>
<body>
<main ng-view>
</main>
</body>
app.js
var myApp = angular.module('myApp', ['ngRoute', 'angularCSS']);
myApp.config(['$routeProvider', function($routeProvider){
$routeProvider
.when('/login', {
templateUrl: 'views/login.html',
css: 'styles.css'
})
.when('/home', {
templateUrl: 'views/home.html',
css: 'styles.css'
})
.when('/signup', {
templateUrl: 'views/signup.html',
css: 'styles.css'
})
.when('/submitdish', {
templateUrl: 'views/submitdish.html',
css: 'styles.css'
})
.when('/login', {
templateUrl: 'views/login.html',
css: 'styles.css'
})
.otherwise({
redirectTo: '/home',
css: 'styles.css'
});
}]);
home.html:
<ul class="nav">
<a align="center" href="views/home.html"><li>Home</li></a>
<a align="center" href=""><li>About</li></a>
<a align="center" href="#"><li>Contact</li></a>
</ul>
<section class="container">
<div class="left-half">
<article>
<a href="views/submitdish.html" class="Button">Sell a Dish</a>
<p>Something Something Something about Selling your home-cooked dishes</p>
</article>
</div>
<div class="right-half">
<article>
<a href="views/buydish.html" class="Button">Buy a Dish</a>
<p>Yada yada yada buy food from your neighbors</p>
</article>
</div>
</section>
最佳答案
尝试改变注入(inject)方式
你有什么
var myApp = angular.module('myApp', ['ngRoute', 'angularCSS']);
到
var myApp = angular.module('myApp', ['ngRoute', 'door3.css']);
就好像你正在使用这个元素和版本 1.0.7
http://door3.github.io/angular-css
还要验证你的 CSS 路径,即使你的 .html 和 css 在同一个文件夹中,你也必须明确
var myApp = angular.module('myApp', ['ngRoute', 'angularCSS']);
myApp.config(['$routeProvider', function($routeProvider){
$routeProvider
.when('/login', {
templateUrl: 'views/login.html',
css: 'views/styles.css'
});
}]);
或者如果在不同的文件夹中
var myApp = angular.module('myApp', ['ngRoute', 'angularCSS']);
myApp.config(['$routeProvider', function($routeProvider){
$routeProvider
.when('/login', {
templateUrl: 'views/login.html',
css: 'Content/styles.css'
});
}]);
关于html - 在 angularjs 中路由时,CSS 未加载到其他 View 中,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/38081659/
我是一名优秀的程序员,十分优秀!