nee*_*mzy 9 javascript css angularjs
我正面临一个类似的问题(但不一样,请耐心等待)在html head中的Conditional-rendering css中描述的问题
我也"懒洋洋地"加载样式表,从我在控制器的最开始初始化的范围变量中获取文件名:
<link rel="stylesheet" data-ng-href="css/{{ filename }}.css" />
正如我正在使用ng-href(这里的data-形式),我确实避免了不需要的请求,例如:
http://localhost/css/%7B%7B%20filename%7D%7D.css
但这一切仍然很快发生,我几乎每次都会得到这个:
http://localhost/css/.css
这似乎意味着请求火灾之间的时刻,当角去除其自己的标记,目前它用正确的值替换它(这是这样,片刻之后,然后我的样式表正确加载).我估计它甚至不可能......!？
我想我可能filename太晚了为范围变量提供了一个值,但正如我所说,这是我在控制器中做的第一件事:
angular.module('myControllers', [])
.controller('TestCtrl', ['$scope', function($scope) {
$scope.filename = 'test';
// some more code...
}]);
我正在使用Angular 1.1.5; 有什么我可以做的吗？这不是什么大不了的事,但如果我能解决它仍然会更好.
编辑:根据要求提供完整的代码.我不会包含页面模板,因为它们与问题无关.
index.html:
<!DOCTYPE html>
<html lang="en" data-ng-app="myapp">
<head>
<meta charset="utf-8" />
<title>My App</title>
<link rel="stylesheet" data-ng-href="/assets/css/{{ filename }}.css" />
</head>
<body>
<div id="app" class="app" style="display: none;" data-ng-view></div>
<script src="/assets/js/lib/angular/angular.min.js"></script>
<script src="/assets/js/app/app.js"></script>
<script src="/assets/js/app/controllers.js"></script>
</body>
</html>
app.js:
var app = angular.module('myapp', ['myControllers'])
.config(['$locationProvider', '$routeProvider', function($locationProvider, $routeProvider) {
$locationProvider.hashPrefix('!');
$routeProvider
.when('/', {
templateUrl: 'path/to/my/template.html',
controller: 'TestCtrl'
})
.otherwise({ redirectTo: '/' });
}]);
app.run();
controllers.js:
angular.module('myControllers', [])
.controller('TestCtrl', ['$scope', '$rootScope', function($scope, $rootScope) {
$rootScope.filename = 'stylesheet';
}]);
(是的,我尝试使用空控制器,就像这个问题一样.)
我通过向标签添加一个ngIf指令来解决它link,所以它不会被渲染,直到filename它不是假的.有点脏,我知道,但它确实有效!
<link rel="stylesheet" data-ng-if="filename" data-ng-href="css/{{ filename }}.css" />