JsRender - 检查嵌套值是否为null

Question

想象一下,在webapp的标题内显示用户的jsrender名称和姓氏.我传递给模板一个对象是"用户"对象.然后在模板中,我显示{{name}}和{{surname}}.但是,如果"User"对象为null或未确定,我如何检查内部模板？我只能检查姓名或姓氏是否为空(或空).

检查空值的正确方法是什么？例如,对象'Order'与另一个嵌套对象'Shipping'具有'id'和'name'属性.Shippinig对象存在且不为null,但其属性为null.

如果我使用"{{如果shipping.id}}"模板我总是得到这个错误:{错误:类型错误:无法读取属性空的"身份证"}这似乎航运为空,即使它是不

当返回的对象为null时(例如,当搜索没有返回结果时),这也应该是有用的,并且我想显示模板而不是另一个

谢谢

Answer 1

假设你有:

var html = myTemplate.render(myOrder);

你的模板是:

{{:shipping.id}}

以下是不同版本的结果myOrder:

• myOrder = {shipping: {name: "Jo", id: "J1"} }

  - > html: "J1

• myOrder = {shipping: {name: "Jo"} }

  - > html: ""

• myOrder = {}

  - > html: "{Error: TypeError: Unable to get property 'id' of undefined or null reference}"

所以现在,有几种方法可以处理最后一种情况 - 不输出错误消息:

1)在标记上使用以指定错误情况下标记的回退呈现.onerror=...{{:}}

例如,如果要在装运对象为null或未定义时呈现空字符串,则可以使用该模板:

{{:shipping.id onerror=''}}

或者你可以写

{{:shipping.id onerror='no shipping info'}}

2)使用{{if}}或测试运输对象{{if}} {{else}} {{/if}}

{{if shipping}}{{:shipping.id}}{{else}}no shipping info{{/if}}

3)使用{{for}}或{{for}} {{else}} {{/for}}

{{for shipping}}{{:id}}{{else}}no shipping info{{/for}}

4)使用空检查

{{:shipping && shipping.id}}

5)使用三元表达式

{{:shipping ? shipping.id : 'no shipping info'}}

总而言之,这是一个显示所有这些替代方案的模板:

模板

<script id="myTmpl" type="text/x-jsrender">
    1 {{:shipping.id onerror='no shipping info'}}<br/>
    2 {{if shipping}}{{:shipping.id}}{{else}}no shipping info{{/if}}<br />
    3 {{for shipping}}{{:id}}{{else}}no shipping info{{/for}}<br />
    4 {{:shipping && shipping.id}}<br />
    5 {{:shipping ? shipping.id : 'no shipping info'}}<br />
</script>

脚本

var myOrder = {};
var html = myTemplate.render(myOrder);

输出:

1没有运送信息
2没有运送信息
3没有运送信息
4
5没有运送信息

最后,如果订单本身为null或未定义,或者您传递了一个订单数组,但有些订单可能未定义,那么您可以用一个{{if #data}}或等价的方式包装整个模板{{if}},它会测试当前对象是否为上下文(上下文)您正在呈现此模板的数据对象)为null.

模板

<script id="myTmpl" type="text/x-jsrender">
    {{if}}
        {{:shipping.id onerror='no shipping info'}}<br/>
    {{else}}
        no order<br/>
    {{/if}}
</script>

脚本

var myOrders = [
  {shipping: {id: "J1"}},
  ,
  {},
  {shipping: {id: "J2"}},
];

var html = myTemplate.render(myOrders)

输出:

J1
没有订单
没有发货信息
J2