2016-08-17 64 views
2

是否爲ng-show的聚合物等效物?這裏是什麼,我想轉換一個片段例如:聚合物相當於ng-show?

<h1>Greeting</h1> 
<div ng-show="authenticated"> 
    <p>The ID is {{controller.greeting.id}}</p> 
    <p>The content is {{controller.greeting.content}}</p> 
</div> 
<div ng-show="!authenticated"> 
    <p>Login to see your greeting</p> 
</div> 

回答

2

dom-if在這裏沒有必要。只需使用$=(屬性綁定)來添加/刪除hidden屬性。

<style> 
[hidden] { 
    display:none; 
} 
</style> 

<h1>Greeting</h1> 
<div hidden$=[[!authenticated]]> 
    <p>The ID is {{controller.greeting.id}}</p> 
    <p>The content is {{controller.greeting.content}}</p> 
</div> 
<div hidden$=[[authenticated]]> 
    <p>Login to see your greeting</p> 
</div> 

使用dom-if作出關於你不想被渲染,而不只是隱藏的代碼塊的決定。

1

我想你可以使用dom-if有條件保持所需的HTML中DOM樹。 properties應該在組件的properties中定義。

<template is="dom-if" if="{{authenticated}}"> 
    <p>The ID is {{controller.greeting.id}}</p> 
    <p>The content is {{controller.greeting.content}}</p> 
</template> 
<template is="dom-if" if="{{!authenticated}}"> 
    <p>Login to see your greeting</p> 
</template> 
+1

dom-if相當於ng-if! –