gpt4 book ai didi

html - 在 angularjs 中路由时,CSS 未加载到其他 View 中

转载 作者:搜寻专家 更新时间:2023-10-31 08:25:29 24 4
gpt4 key购买 nike

嘿,所以我使用 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/

24 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com