打字稿与聚合物

mikeysee 发表于 Dev

米奇湖

我知道关于此主题还有其他问题，但是没有一个答案特别有用，有些答案已经过时，所以我想我会再问一次。

有没有人能让Polymer和Typescript玩的不错？似乎它几乎就在那儿，理想情况下，我们想为聚合物提供一个类实例或原型，然后由它负责其余的工作。

例如，给出以下内容：

<link rel="import" href="../bower_components/polymer/polymer.html">

<polymer-element name="my-element" attributes="color">
    <template>       
        Hello there <strong>{{name}}</strong>
        <button on-click="{{setFocus}}">Set focus to text input</button>
    </template>
    <script src="my-element.js"></script>    
</polymer-element>

如果我们这样做：

class MyElement {
    name = "Mike";
    setFocus() {
        console.log("called");        
    }
}
Polymer(new MyElement());

然后，我们将正确输出“名称”，但是单击按钮不会调用该函数。

但是，如果我们这样做：

class MyElement {
    name = "Mike";
    setFocus() {
        console.log("called");        
    }
}
Polymer(MyElement.prototype);

然后，当单击按钮但变量未定义时，我们将获得控制台输出。

有人知道我们如何使它们发挥出色吗？

彼得·伯恩斯

默认字段值是在构造函数中设置的，但是当您将原型传递给Polymer()它时，将无法访问构造函数。

而是在created回调中设置默认值。这有点骇人听闻，但不仅限于Typescript，我也遇到了编写用作聚合物元素的闭包编译器样式类的事情。

class MyElement {
    name : string;
    created() {
      this.name = "Mike";
    }
    setFocus() {
        console.log("called");        
    }
}
Polymer(MyElement.prototype);

本文收集自互联网，转载请注明来源。

如有侵权，请联系[email protected] 删除。