ポリマーdom-if：どのように負の条件を実装しますか？

Question

私は<template is="dom-if"...を使用して、条件によって異なるHTMLコンテンツを提供するPolymer要素を持っています。

ポリマーdom-ifにはその他の条件がないため、シミュレーションするには条件が負の場合が必要です。このような

何か：のみ

<link href="https://polygit.org/components/polymer/polymer.html" rel="import"> 
 

 
<dom-module id="test-thing"> 
 
    <template> 
 
    <template is="dom-if" if="{{title}}" restamp> 
 
     <b>[[title]]</b> 
 
    </template> 
 
    <template is="dom-if" if="{{!title}}" restamp> 
 
     <i>no title</i> 
 
    </template> 
 
    </template> 
 
    <script> 
 
    Polymer({ 
 
     is: 'test-thing', 
 
     properties: { 
 
     title: String 
 
     } 
 
    }); 
 
    </script> 
 
</dom-module> 
 

 
<div> 
 
    With negative condition: 
 
    <test-thing></test-thing> 
 
</div> 
 
<div> 
 
    With positive condition: 
 
    <test-thing title="Has Title"></test-thing> 
 
</div>

動作しません - 負の状態が渡されません。

これはどのように実装する必要がありますか？

Answer 1

あなたのタイトルプロパティのデフォルト空の値を使用する必要があります。

title:{type: String,value:''} 

ので、同様：titleプロパティに値がない場合

<link href="https://polygit.org/components/polymer/polymer.html" rel="import"> 
 

 
<dom-module id="test-thing"> 
 
    <template> 
 
    <template is="dom-if" if="{{title}}" restamp> 
 
     <b>[[title]]</b> 
 
    </template> 
 
    <template is="dom-if" if="{{!title}}" restamp> 
 
     <i>no title</i> 
 
    </template> 
 
    </template> 
 
    <script> 
 
    Polymer({ 
 
     is: 'test-thing', 
 
     properties: { 
 
     title: {type: String,value:''} 
 
     } 
 
    }); 
 
    </script> 
 
</dom-module> 
 

 
<div> 
 
    With negative condition: 
 
    <test-thing></test-thing> 
 
</div> 
 
<div> 
 
    With positive condition: 
 
    <test-thing title="Has Title"></test-thing> 
 
</div>