將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表達式

回答

相關問題