将CSS样式应用于使用jQuery脚本的angularjs表达式

我很困惑，我有一个jQuery脚本，如果它在html表中找到负数，就会将文本颜色更改为红色。将CSS样式应用于使用jQuery脚本的angularjs表达式

console.log("reading Script"); 
    $('td:nth-child(3)').each(function() { 
     var txt = $(this).text(); 

    if (txt.indexOf('-') > -1) { 
     $(this).css("color", "red"); 
     console.log("True: " + txt); 
    } else { 
     $(this).css("color", "green"); 
     console.log("False: " + txt); 
    } 
});

该脚本可以完美运行在一个例子我使用的是“NG重复d数据”这一表达{{d.category}}但我有第二个例子，它不工作，我正在使用相同的脚本，但角度表达式不同，因为我阅读的JSON结构不同，ng-repeat =“PostResponse.result中的数据”，我的角度表达式如下所示{{data.merchMetrics.category} }在这里，我得到了所有的绿色值，甚至负数，所以我没有得到它，因为第一个例子是完全一样的，唯一不同的是数据的结构。

即使控制台日志的作品不同，在我的第一个示例记录是这样的：

真：-4
假10

这是确定的，但在第二个例子中林在控制台中获取：

False：{{data.merchMetrics.category}}

那么，有什么想法？

来源

2016-01-05 kennechu

您在Angular应用程序中使用jQuery编码实践，这会让您头痛 - 因为这些实践违背了Angular的精神，也因为您不会从Angular获得好处。

在您的第一种情况下，您最有可能遇到计时问题Angular已将您的模板表达式替换为值，而第二种情况下则不是。你不应该这样操纵DOM。 Angular开发中最重要的部分之一是：您不应该从DOM解析数据，有史以来。

您应该使用ng-class来执行条件格式。

<td ng-class="{ positive: data.merchMetrics.category < 0, negative: data.merchMetrics.category >= 0}">{{data.merchMetrics.category}}</td>

然后定义两个CSS类，positive和negative分别为red和字体颜色。

多一点背景，为什么角应区别使用比jQuery的可以在这里找到其他资源：

来源

2016-01-05 16:17:33

伟大@JohannesJander 感谢您的时间:) – kennechu

最有可能在一种情况下，它的工作原理是当jQuery脚本运行时数据已经存在，而另一种情况还没有（Javascript是异步的）。您可能需要阅读有关angular的更多信息，您不需要调用该类，就可以加载数据，并根据该值计算类。 –

将CSS样式应用于使用jQuery脚本的angularjs表达式

回答

相关问题