Question

继续发现angularjs并坚持改变对象上的颜色，如果它是真的 - 例如。绿色，假如另一种颜色。我试图意识到这一点，但它向我展示了所有渲染数据的颜色：

rssFeedService.getFeed().then(function (results) {
    $scope.feed = results.data;

    $scope.feed.forEach(function (checkitem){
        if (!checkitem.isRead) {
            $scope.read = {
                "color": "white",
                "background-color": "coral"
            }
        } else {
            $scope.read = {
                "color": "white",
                "background-color": "green"
            }
        }
    });

}, function (error) {
    //alert(error.data.message);
});

我在这里获取数据并使用循环设置颜色。

<div class="col-md-12" ng-repeat="q in feed">

    <a href="{{q.link}}">
        <h1 ng-click="isReadClick(q.id)" ng-style="read"> {{q.title}}</h1>
    </a>

    <h4>{{q.body}}</h4>

</div>

我假设发生这种情况是因为我使用ng-style并且应该使用ng-class来设置静态颜色。

Answer 1

如果您正在使用ng-repeat，那么我建议使用ng-class。

<h1 ng-click="isReadClick(q.id)" ng-class="q.isRead ? 'green' : 'red'"> {{q.title}}</h1>

在示例中，如果q.isRead值为true，则设置类green，否则设置类red。

使用angularjs更改背景颜色

1 个答案: