ng-class在调用时不起作用

时间:2014-12-04 10:42:31

标签: javascript html css angularjs ng-class

我的控制器中有这个功能:

$scope.menus = {};
    $http.get('web/core/components/home/nav.json').success(function (data) { $scope.menus = data; $scope.validaMenu(); }).error(function () { console.log('ERRO') });
    $scope.m = {};

    $scope.validaMenu = function () {        

            for (var i = 0; i < $scope.menus.length; i++) {
                $scope.m[$scope.menus[i].name] = { url: $scope.menus[i].url, style:"ativo"};
            }
    };

在我的JSON中,我得到了这个:

[

    {"name" : "CAD_Empresa", "url": "#/Cadastro/Empresa"},
    {"name" : "CAD_Perfil", "url": "#/Cadastro/Perfil"},
    {"name" : "CAD_PlanoConta", "url":  "#/Cadastro/PlanoConta"},
    {"name" : "CAD_CentroCusto", "url": "#/Cadastro/CentroCusto"},
    {"name" : "CAD_TipoDocumento", "url": "#/Cadastro/TipoDocumento"},
    {"name" : "CAD_ParceiroComercial", "url":  "#/Cadastro/ParceiroComercial"}
]

这是我的HTML:

<ul class="multi-column-dropdown">    
<li><a ng-class="{{m['CAD_Usuario'].style}}" ng-href="{{m['CAD_Usuario'].url}}" >Usuário</a></li>
<li><a ng-class="{{m['CAD_Empresa'].style}}" ng-href="{{m['CAD_Empresa'].url}}" >Empresa</a></li>
</ul>

此代码使用我的JSon并创建一个链接,我的ng-route重定向到另一个页面。我想做的就是在&lt;上显示一个不允许的游标。 li>没有任何链接的选项。为此,我创建了上面的函数,并在我的CSS上强制使用这样的光标:

.multi-column-dropdown li a {
    cursor: not-allowed;
}

没关系,它正在发挥作用。但是,您可以检查我在HTML上使用ng-class创建了一个自定义类吗?当我尝试使用我的clas(ativo)在我的CSS上设置任何东西时,我没有改变任何东西。

知道为什么我的ng-class被忽略了?

1 个答案:

答案 0 :(得分:0)

删除双花括号{{}}ng-class需要一个表达式。

<li><a ng-class="m['CAD_Usuario'].style">