Question

我开始研究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) {

})

P.S。控制台中没有错误。

Answer 1

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

与定义范围变量相同，它是从

返回值

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

<强>代码

$scope.class='orange';

两种方法都是一样的。

<强>更新

您需要添加css类才能获得这些更改

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

Demo Plunkr

Answer 2

当你想要一个动态或范围相关的类时，如果你想让一个静态类只使用类，则使用

ng-class。我看到了你的评论，它没有以任何方式取代任何CSS。它只是一种动态交换css类的方法。

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

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

并在控制器中

$scope.class='orange';

或与condiotions：

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

或tenaric if：

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

natuarlly条件在范围内定义，''项目是要添加的类

ng-class在h1内没有正常工作？

2 个答案: