jjzjj

javascript - 结合变化的 Polymer 1.0 Array Observers

coder 2025-03-07 原文

我正在尝试观察传递给 Polymer 元素的对象数组的变化。当一个新项目被添加到数组中时，该数组也会在 Polymer 元素中发生变化。但是，永远不会调用观察者方法。

包含元素

<dom-module is="table-container">
  <template>
    <selectable-table table-items="{{items}}"></selectable-table>
    <button on-click="addItem">Add Item</button>    
  </template>
  <script>
    Polymer({
      is : "table-container",
      attached : function() {
        this.items = [];
        for (var i = 0; i < 3; i++) {
          this.push("items", {
            numerical: "1",
            english: "one"
          });
        }
      },
      addItem : function() {
        this.push("items", {
          numerical: "3",
          english: "three"
        })
      }
    })
  </script>
</dom-module>

尝试观察这里的变化:

<dom-module id="selectable-table>
  <template>
    <div>{{tableItems}}</div>
  </template>
  <script>
    Polymer({
      is : "selectable-table",
      properties : {
        tableItems: {
          type: Object,
          notify: true,
          observer: "updateTableItems"
        }
      }
      updateTableItems : function() {
        // Updates here
      }
    });
  </script>
</dom-module>

“updateTableItems”方法首先在项目数组首次填充时被调用，但在单击按钮添加更多对象时从未被调用。

最佳答案

要观察数组的变化，请使用以下观察者样式。

Polymer({
  is : "selectable-table",
  properties : {
    tableItems: {
      type: Array,
      notify: true,
    }
  },

  observers: [
      'updateTableItems(tableItems.*)'
  ],
  updateTableItems : function() {
    // Updates here
  }
});

因为 tableItems 是一个对象数组，所以您应该在属性声明中使用 Array 类型。如果您将新的数组实例分配给 tableItems 属性，您使用的观察者类型只会触发。对于数组的操作，将回调添加到 observers。您可以在 docs 中找到更多详细信息.

关于javascript - 结合变化的 Polymer 1.0 Array Observers，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/32747109/

javascriptObserverscode34sectionpolymerweb-componentpolymer-1.0custom-element

有关javascript - 结合变化的 Polymer 1.0 Array Observers的更多相关文章

  1. ruby-on-rails - 结合 meta_search 与 acts_as_taggable_on - 2

    我在开发的Rails3网站的一些搜索功能上遇到了一个小问题。我有一个简单的Post模型，如下所示:classPost我正在使用acts_as_taggable_on来更轻松地向我的帖子添加标签。当我有一个标记为“rails”的帖子并执行以下操作时，一切正常:@posts=Post.tagged_with("rails")问题是，我还想搜索帖子的标题。当我有一篇标题为“Helloworld”并标记为“rails”的帖子时，我希望能够通过搜索“hello”或“rails”来找到这篇帖子。因此，我希望标题列的LIKE语句与acts_as_taggable_on提供的tagged_with方法

  2. ruby-on-rails - 启用 Rack::Deflater 时 ETag 发生变化 - 2

    在启用Rack::Deflater来gzip我的响应主体时偶然发现了一些奇怪的东西。也许我遗漏了一些东西，但启用此功能后，响应被压缩，但是资源的ETag在每个请求上都会发生变化。这会强制应用程序每次都响应，而不是发送304。这在没有启用Rack::Deflater的情况下有效，我已经验证页面源没有改变。我正在运行一个使用thin作为Web服务器的Rails应用程序。Gemfile.lockhttps://gist.github.com/2510816有没有什么方法可以让我从Rack中间件获得更多的输出，这样我就可以看到发生了什么？提前致谢。 最佳答案

  3. ruby-on-rails - 使用 javascript 更改数据方法不会更改 ajax 调用用户的什么方法？ - 2

    我遇到了一个非常奇怪的问题，我很难解决。在我看来，我有一个与data-remote="true"和data-method="delete"的链接。当我单击该链接时，我可以看到对我的Rails服务器的DELETE请求。返回的JS代码会更改此链接的属性，其中包括href和data-method。再次单击此链接后，我的服务器收到了对新href的请求，但使用的是旧的data-method，即使我已将其从DELETE到POST(它仍然发送一个DELETE请求)。但是，如果我刷新页面，HTML与"new"HTML相同(随返回的JS发生变化)，但它实际上发送了正确的请求类型。这就是这个问题令我困惑的

  4. ruby-on-rails - 将 Amazon Simple Notification service SNS 与 ruby​​ 结合使用 - 2

    很难说出这里要问什么。这个问题模棱两可、含糊不清、不完整、过于宽泛或夸夸其谈，无法以目前的形式得到合理的回答。如需帮助澄清此问题以便重新打开，visitthehelpcenter.关闭9年前。我需要从基于ruby​​的应用程序使用AmazonSimpleNotificationService，但不知道从哪里开始。您对从哪里开始有什么建议吗？

  5. ruby-on-rails - ruby 中两个哈希之间的变化 - 2

    我有两个具有以下格式的哈希mydetails[x['Id']]=x['Amount']这将包含如下数据hash1={"A"=>"0","B"=>"1","C"=>"0","F"=>"1"}hash2={"A"=>"0","B"=>"3","C"=>"0","E"=>"1"}我期待这样的输出:Differencesinhash:"B,F,E"非常感谢任何帮助。 最佳答案 这个解决方案可能更容易理解:(hash1.keys|hash2.keys).select{|key|hash1[key]!=hash2[key]}Array#|返回2

  6. ruby - 在 Mechanize 中使用 JavaScript 单击链接 - 2

    我有这个:AccountSummary我想单击该链接，但在使用link_to时出现错误。我试过:bot.click(page.link_with(:href=>/menu_home/))bot.click(page.link_with(:class=>'top_level_active'))bot.click(page.link_with(:href=>/AccountSummary/))我得到的错误是:NoMethodError:nil:NilClass的未定义方法“[]” 最佳答案 那是一个javascript链接。Mechan

  7. javascript - jQuery 的 jquery-1.10.2.min.map 正在触发 404(未找到) - 2

    我看到有关未找到文件min.map的错误消息:GETjQuery'sjquery-1.10.2.min.mapistriggeringa404(NotFound)截图这是从哪里来的？ 最佳答案 如果ChromeDevTools报告.map文件的404(可能是jquery-1.10.2.min.map、jquery.min.map或jquery-2.0.3.min.map，但任何事情都可能发生)首先要知道的是，这仅在使用DevTools时才会请求。您的用户不会遇到此404。现在您可以修复此问题或禁用sourcemap功能。修复:获取文

  8. ruby-on-rails - 我将 Rails3 与 tinymce 一起使用。如何呈现用户关闭浏览器javascript然后输入xss？ - 2

    我有一个用Rails3编写的站点。我的帖子模型有一个名为“内容”的文本列。在帖子面板中，html表单使用tinymce将“content”列设置为textarea字段。在首页，因为使用了tinymce，post.html.erb的代码需要用这样的原始方法来实现。.好的，现在如果我关闭浏览器javascript，这个文本区域可以在没有tinymce的情况下输入，也许用户会输入任何xss，比如alert('xss');.我的前台会显示那个警告框。我尝试sanitize(@post.content)在posts_controller中，但sanitize方法将相互过滤tinymce样式。例如

  9. ruby-on-rails - 将 Rails 与 Paperclip 和 SWFUpload 结合使用 - 2

    我有一个基本的Rails应用程序测试，其中包含一个用回形针处理的照片字段的用户模型。我创建了能够创建/编辑用户的View，并且照片上传工作正常。Editinguseruser_path(@user),:html=>{:method=>"put",:multipart=>true}do|f|%>|然后，我想将SWFUpload集成到我的应用程序中。我试着按照这个tutorial并运行testproject没有任何成功:浏览按钮不会打开文件对话框，并抛出错误#2176，这是关于selectFiles()方法的。首先，问题是Flashv.10与项目中包含的旧版本SWFUpload(2.1.0

  10. ruby - 使用 Selenium WebDriver 启用/禁用 javascript - 2

    出于某种原因，我必须为Firefox禁用javascript(手动，我们按照提到的步骤执行http://support.mozilla.org/en-US/kb/javascript-settings-for-interactive-web-pages#w_enabling-and-disabling-javascript)。使用Ruby的SeleniumWebDriver如何实现这一点？ 最佳答案 是的，这是可能的。而是另一种方式。您首先需要查看链接Selenium::WebDriver::Firefox::Profile#[]=

随机推荐