![](/img/trans.png)
[英]How to set CSS class in AngularJS directive and default if none set?
[英]AngularJS - how to set css class for the custom directive?
有tab
的CSS类nav
这我会像这个指令使用HTML元素:
<nav tab></nav>
期望这样解释:
<nav class="tab">
<a></a>
<a></a>
<a></a>
</nav>
...并且除了我无法将CSS类设置为顶部<nav>
元素的问题之外,其他所有功能均按预期工作。 当然,我可以使用ng-class
明确指定它,但这似乎不是一个好主意。
听说过.addClass()
选项,但它根本不起作用:
tab.directive('tab', function($compile) {
return {
restrict: 'A',
templateUrl: 'nav-tab.html',
controller: function($http, $scope) {
$http.get('/Tab/List')
.success(function(data) {
$scope.tabs = data;
}).error(function() {
alert("error");
});
},
controllerAs: 'tab',
link: function(element, scope) {
angular.element(element).addClass('tab');
$compile(element)(scope);
}
}
});
如何将CSS类添加到top指令元素,而无需在元素上明确指定?
链接功能顺序错误
代替
link: function(element, scope) {
更改为
link: function(scope, element, attrs) {
然后,您可以直接执行element.addClass
因为jQLite
api上具有.addClass
方法。
我会将您的指令更改为“元素”(属性使用“ E”代替“ A”)
<tab></tab>
tab.directive('tab', function($compile) {
return {
restrict: 'E',
templateUrl: 'nav-tab.html'...
然后在您的模板nav-tab.html中添加该类:
<nav class="tab">
<a></a>
<a></a>
<a></a>
</nav>
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.