1

我开始学习 AngularJs，我想知道为什么我的代码不起作用？我想知道为什么h1标签没有变成橙色ng-class="'orange'"。

我知道答案可能很简单，但我才刚刚开始。

这是我的 index.html：

<html ng-app="app">
    <head>
        <style type="text/css">
        </style>

    </head>
    <body>

        <div ng-controller="MainController">
            <h1 ng-class="'orange'">Hello There</h1>
        </div>


        <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.16/angular.min.js"></script>
        <script type="text/javascript" src="app.js"></script>
    </body>
</html>

这里是我的 app.js：

var app = angular.module('app', []);

app.controller('MainController', function($scope) {

})

ps控制台中没有错误。

4

2 回答 2

1

它必须工作。因为作为结果，您将类作为直接string变量，其值orange带有单引号。

这与您定义的范围变量相同，该范围变量从 as 返回值

<h1 ng-class="class">Hello There</h1>

代码

$scope.class='orange';

这两种方法是一回事。

更新

您需要添加 css 类来获取这些更改

<style type="text/css">
  .orange {
     color: orange;
  }
</style>

演示 Plunkr

于 2015-06-14T14:56:53.267 回答
1

当你想要一个动态或范围相关的类时使用 ng-class，如果你想要一个静态类，只需使用 class。我看到了您的评论，它不会以任何方式替换任何 CSS。它只是一种动态交换 css 类的方法。

您可以通过多种方式使用它，例如：

<h1 ng-class="class">Hello There</h1>

并在控制器中

$scope.class='orange';

或有条件：

<h1 ng-class="{'danger' : condition}"><Hi</h1>

如果：

 <h1 ng-class=" condition? 'danger' : 'warning'">Hi</h1>

自然条件在范围中定义，“”项是要添加的类

于 2015-06-14T15:14:44.043 回答