用一种方法对聚合物的性能值进行刷新

Polymer refresh the property's value which is calculated by a method

本文关键字：性能 刷新 聚合物 方法 一种      更新时间：2023-09-26

我们目前正在做一个项目，其中我们使用了AngularJS和Polymer的组合。

我们有一些结构，但真正重要的是这段代码:

<template is="dom-bind" angupoly="{dataContainer:'dataContainer'}">
    <menu-list for="places" data="{{dataContainer.getSomeData()}}">
</template>

我们在$scope上定义了一个名为dataContainer的变量，它是在控制器中设置的。问题是这段代码是在控制器准备该属性之前执行的，所以它是未定义的——它抛出:

[dom-bind::_annotatedComputationEffect]:计算方法dataContainer.getSomeData()未定义

数据永远不会再刷新，它不起作用。相反，如果有一个属性，它就会工作(它的第一个状态是否未定义并不重要)，它会被刷新。

因为这在我们的应用中是非常重要的一点，我们想问。如何达到要求的行为?

谢谢，祝你有美好的一天!:)

我不熟悉聚合物，如果有可能延迟聚合物代码的执行，或者如果有一个可以在AngularJS中使用的摘要循环。

但是我猜你可以避免这种竞争条件与简单的ng-if=结合在AngularJS方面的<ng-include> -因为它不添加元素到DOM，从而避免与聚合物的任何类型的相互作用，直到它被包含。

所以例如:

<figure ng-if="dataContainer.getSomeData">
    <ng-include src="'template.html'">
</figure>

在template.html中你的(未修改的)代码:

<template is="dom-bind" angupoly="{dataContainer:'dataContainer'}">
    <menu-list for="places" data="{{dataContainer.getSomeData()}}">
</template>

如果这对你有帮助，我会很高兴-但正如我所说，这只是一个猜测，我不太了解聚合物以及它如何与DOM相互作用。

您看到的错误不是由未定义的dataContainer引起的，而是由对其调用的函数引起的。在数据绑定中，Polymer不支持这种类型的函数调用。来自文档:

数据绑定将自定义元素(宿主元素)的属性或子属性绑定到本地DOM中元素(子元素或目标元素)的属性或属性。

你正在调用一个属性上的函数，它不起作用。如果你想调用一个函数，你可以通过计算绑定来实现。

<menu-list for="places" data="{{getData(dataContainer.*)}}">

然而，这假设您的菜单列表被放置在一些父聚合物元素中，我不确定是否在这里使用dom-bind时是这种情况。但是，如果确实有父元素，则可以在那里添加computed函数。

Polymer({
    is: 'parent-element',
    properties: {dataContainer: ....},
    getData: function() {
        return dataContainer.getSomeData();
    }
});

getData将在dataContainer或其子属性发生变化时被调用。

相关文章：