jquery - 将对象值连接到html模板中的字符串变量

在使用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]

为什么我没有在DOM中获得{{Color.id}}的值？
我期待类似的东西。

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

任何帮助，将不胜感激。

最佳答案

这已经是一个角度表达式：

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编写此函数相同：

函数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以及得到评估的内容感到困惑。