Question

虽然我通常能够为网页制作CSS样式，但我尝试使用AngularJS对css进行的任何更改，即使使用ng-style="xy"，也不会改变页面上的任何内容。

这是我的代码：

<div id="tableScrollPanel">
    <table class="table">
        <thead>
        <tr>
            <th></th>
            <th ng-style="{
                    display: 'inline-block',
                    white-space: 'nowrap',
                    -webkit-transform: 'translate(0em, 0em) rotate(-90deg)',
                    -moz-transform: 'translate(0em, 0em) rotate(-90deg)',
                    -o-transform: 'translate(0em, 0em) rotate(-90deg)',
                    transform: 'translate(0em, 0em) rotate(-90deg)',
                    -webkit-transform-origin: '0em 0em',
                    -moz-transform-origin: '0em 0em',
                    -o-transform-origin: '0em 0em',
                    transform-origin: '0em 0em',
                    -ms-transform: 'none',
                    -ms-transform-origin: 'none',
                    filter: 'progid:DXImageTransform.Microsoft.BasicImage(rotation=3)',
                    position: 'absolute',
                    bottom: '0em\9'
                    }" ng-repeat="(key,headline) in model.headlines" ng-class="headline.classes" data-ng-bind="headline.name">
                {{headline}}
            </th>
        </tr>
        </thead>

        <tbody>
        <tr data-ng-repeat="(key, row) in model.rows">
            <td data-ng-bind="row.title"></td>
            <td data-ng-repeat="(key2, column) in row.columns">
                <input type="text" data-ng-model="column.entry" ng-disabled="column.disabled"
                       ng-change="changeEntry(key, key2)">
            </td>

        </tr>
        </tbody>
    </table>
</div>
<div style="text-align: right">
    <button class="btn" data-ng-click="saveChanges()">Speichern</button>
</div>

Answer 1

您必须对-

的属性使用简单引用

所以对于白色空间，它应该是：

'white-space': 'nowrap'

Answer 2

将CSS从ng-style中取出并创建一个CSS类并将其添加到ng-class中。

如果没有别的东西，它会更容易阅读。

您期望发生什么？另外，你在第一个元素中使用ng-repeat做什么？

如何使用AngularJS更改CSS样式？

2 个答案: