將對象值連接到html模板中的字符串變量

Question

我在使用ng指令時卡住了一個點。我將兩個參數傳遞給mouseoverOnStep函數，一個是對象值本身，第二個是元素的selector。我有下面的HTML代碼

<li ng-mouseover="mouseoverOnStep(Color.color_value, '.mask-second-{{Color.id}}');" ng-repeat="Color in select.Color">&nbsp;</li> 

什麼我得到的輸出，當我檢查我的元素。這是

<li ng-repeat="Color in select.Color" ng-mouseover="mouseoverOnStep(Color.color_value, '.mask-second-');" class="ng-scope">&nbsp;</li> 

隨着

Error: [$parse:syntax] 

爲什麼我沒有得到的{{Color.id}}在DOM的價值？ 我期待着類似的東西。

ng-mouseover="mouseoverOnStep(Color.color_value, '.mask-second-12');" 
ng-mouseover="mouseoverOnStep(Color.color_value, '.mask-second-13');" 

任何幫助，將不勝感激。

Answer 1

這已經是一個角的表達式：

ng-mouseover="mouseoverOnStep(Color.color_value, '.mask-second-{{Color.id}}');" 

把{{ }}成JavaScript無效。

你有2種選擇：

ng-mouseover="mouseoverOnStep(Color.color_value, '.mask-second-'+ Color.id);" 

這不會評價，並顯示Color.id的價值，又何必呢？這與在JavaScript中編寫此功能相同：

function showMeId（value）{ console.log（value）; }

showMeId（'。mask-second-'+ Color.id）; //在javascript中你永遠不會看到評估。

- 或 -

ng-mouseover="mouseoverOnStep(Color);" 

您mouseoverOnStep：

function mouseoverOnStep(color) { 
    var cssClass = '.mask-second-' + Color.id; 
} 

我認爲你要與什麼是JavaScript和HTML是什麼，什麼就會執行這個困惑。