Question

这似乎应该相当简单，但我完全没有选择

在我看来，我有：

<div>{{selectedTheme.theme}}</div>
<ion-nav-view ng-class="selectedTheme.theme" name="menuContent"></ion-nav-view>

第一个div按预期输出类。但是，我无法将类插入到ion-nav-view元素中！

结果标记如下：

<div class="ng-binding">Dark</div>
<ion-nav-view ng-class="selectedTheme.theme" name="menuContent" class="view-container" nav-view-transition="ios" nav-view-direction="none" nav-swipe="">></ion-nav-view>

任何输入都是巨大的！

PS：此外，只需使用class进行设置即可。

Answer 1

在Angular ng-class中使用表达式或仅使用普通的旧字符串。你可以这样做：

基于角度变量添加/删除类
根据评估的表达式添加/删除类
根据动态数据绑定单个或多个类

您可以将Angular变量添加到ng-class，这是将用于该元素的类。因此，在您的情况下，如果selectedTheme.theme生成您希望使用的确切class名称，那么它应该可以正常工作。

<ion-nav-view ng-class="varHoldingClassName" name="menuContent"></ion-nav-view>

所以这是一个完整的例子：

var myApp = angular.module('myApp',[]);

function MyCtrl($scope) {
    $scope.name = 'Angular!';
    $scope.selectedTheme = {
         'coalTheme': 'textColor'
    };
}

.textColor{
    color: red;  
}

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>

<div ng-app="myApp">
<div ng-controller="MyCtrl">
    <div ng-class="selectedTheme.coalTheme">Hello, {{name}}!</div>
</div>
</div>

如何将此范围变量绑定到ng-class属性？

1 个答案: