templateInstance.model 在 Polymer 1.0 中

Question

在 polymer 0.5 中，this.templateInstance.model 提供了一种访问在 this 元素的包含 is="auto-binding"（或任何其他）模板范围内定义的属性的方法。

现在，在 Polymer 1.0 中，访问包含 is="dom-bind"（或任何其他）模板属性的等效方法是什么？

编辑：

例如，在下面的代码段中，元素 <my-el-a> 和 <my-el-b> 打算将值设置为包含 <template is="dom-bind"> 的 counterA 和 counterB属性分别。

<my-el-b> 通过反射属性 counter (notify:true).

成功地做到了这一点

<my-el-a> 打算通过 "parent"/templateInstance.model 这样做但失败了。这个曾经在 Polymer 0.5 中工作。我怎样才能让它在 Polymer 1.0 中工作？换句话说，templateInstance.model 的等价物是什么？

<script>
  ! function() {
    var counterA = 0;
    Polymer({
      is: 'my-el-a',
      ready: function() {
        counterA += 1;
        this.instanceTemplate.model.counterA = counterA; //used to work in Polymer 0.5
      }
    })
  }();
</script>

<script>
  ! function() {
    var counterB = 0;
    Polymer({
      is: 'my-el-b',
      properties: {
        counter: {
          value: 0,
          type: Number,
          notify: true
        }
      },
      ready: function() {
        counterB += 1;
        this.counter = counterB;
        console.log(this);
      }
    })
  }();
</script>

<template is="dom-bind">
  <div>CounterA: <span>{{counterA}}</span>
  </div>
  <div>CounterB: <span>{{counterB}}</span>
  </div>
  <my-el-a></my-el-a>
  <my-el-b counter="{{counterB}}"></my-el-b>
</template>

Answer 1

在 <template is="dom-bind"> 上下文中定义的属性可直接在模板元素本身上使用。

你要的是反模式，你应该使用绑定系统。

如果更清楚为什么要避免绑定系统，也许会出现另一个答案。

Fwiw，不能保证过去在 0.5 中工作的东西在 1.0 中会有类似的东西。数据系统被完全替换。

Answer 2

参见：

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

虽然文档中并不清楚这一点，但我相信 event.model 也可以添加到从 dom-bind 内部触发的事件中。然而，modelForElement、itemForElement 和 indexForElement 方法仅适用于 dom-repeat。

我过去只在模板转发器上使用过它们，但如果您有一个很好的用例将它们放在自动绑定模板上，您可能想要打开一个功能请求。

Answer 3

尚未记录，但从 source code 可以明显看出，我可以从 dataHost 访问模板实例属性，定义为：

var dataHost = (this.dataHost && this.dataHost._rootDataHost) || this.dataHost;

在问题中给出的示例的上下文中，我可以替换：

this.instanceTemplate.model.counterA = counterA;

与：

var dataHost = (this.dataHost && this.dataHost._rootDataHost) || this.dataHost;
dataHost.counterA = counterA;

换句话说，templateInstance.model被替换为dataHost。

Answer 4

只需分配任何属性并绑定到它就可以工作，就像在 dom-bind 测试中所做的那样 - https://github.com/Polymer/polymer/blob/3b0d10b4da804703d493da7bd0b5c22fc6f7b173/test/unit/dom-bind.html#L30 - https://github.com/Polymer/polymer/blob/3b0d10b4da804703d493da7bd0b5c22fc6f7b173/test/unit/dom-bind.html#L65 分配并绑定到 value 和 notifyingvalue.

A working example at JS Bin

templateInstance.model 在 Polymer 1.0 中

templateInstance.model in Polymer 1.0

javascript

polymer

polymer-1.0