web-dev-qa-db-ja.com

Polymer 1.0：dom-ifの使用に関するヘルプ

誰かがdom-ifの適切な実装の例を提供できますか？

公式ドキュメント では適切な使用例は提供されていません。 （申し訳ありませんが、直接リンクはありません。左上のメニューを使用し、dom-ifを選択する必要があります）。

これが私がこれまで持ってきたものです。明らかに、それは機能していません。

<template>
  ...
  <template is="dom-if" if="{{action}}=='Login'">
       <!-- Also tried: if="{{action=='Login'}}" -->
    <a href="#">Forgot password?</a>
  </template>
  ...
</template>
javascriptapidompolymerpolymer-1.0
11
Mowzer

面倒ですが、これを行う必要があります。

<template is="dom-if" if="[[_actionIsLogin(action)]]">
  <a href="#">Forgot password?</a>
</template>

<script>
  Polymer({
    ...
    _actionIsLogin: function(action) {
      return action === 'Login';
    }
    ...
  });
</script>

trueまたはfalseを返す関数を明示的に作成します。

29
agektmr

次の例はかなり単純で、理解/実装が簡単だと思います（提供したリンクにはありません）。

https://www.polymer-project.org/1.0/docs/devguide/templates.html

ページから...

<div>{{user.name}}</div>

<template is="dom-if" if="{{user.isAdmin}}">
  Only admins will see this.
  <div>{{user.secretAdminStuff}}</div>
</template>
...

それが役に立てば幸い。

4
Zohar81
<template>
    <iron-ajax           
            auto
            url="https://jsonplaceholder.typicode.com/todos"
            handle-as="json"
            last-response="{{baul}}">
    </iron-ajax>

    <template is="dom-repeat" items="{{baul}}" >
        <template is="dom-if" if="{{item.completed}}">{{item.title}} is completed<br></template>
    </template>


</template>
1
Cesar SC