jQuery模板中的条件运算符

前端之家收集整理的这篇文章主要介绍了jQuery模板中的条件运算符前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
新的jQuery模板插件是否支持条件(三元)运算符?要根据条件打印简单值,{{if}} / {{else}}是唯一选项吗?

我对类似于<?=($review?'ham':'spam')的内容感兴趣?>

解决方法

是的,您可以在 ${}模板标记内放置任意函数和表达式:

Evaluates the specified field
(property) on the current data item,
or the specified JavaScript function
or expression.

${reviewed ? 'ham' : 'spam'}

所以,你可以写一个这样的模板:

<script id="movieTemplate" type="text/x-jquery-tmpl">
    <!-- Ternary operator to assign a class -->
    <li class="${Year >= 1990 ? 'orange' : 'yellow'}">
        Title: ${Name}.
        {{each Languages}}
            ${$index + 1}: <em>${$value}. </em>
        {{/each}}
    </li>
</script>

给出这样的JavaScript和JSON数据:

var movies = [
{
    Name: "Meet Joe Black",Languages: ["French"],Year: 1990
},{
    Name: "The Mighty",Languages: [],Year: 1985
},{
    Name: "City Hunter",Languages: ["Mandarin","Cantonese"],Year: 1994
}];

$("#movieTemplate").tmpl(movies).appendTo("#movieList");

这对于年龄大于或等于1990年的电影应用了一类“橙色”,对于年龄小于1990年的电影则应用了一类“黄色”.

这里的工作示例:http://jsfiddle.net/andrewwhitaker/dY43s/

猜你在找的jQuery相关文章