CODEWITHSUNDEEP
javascriptcoffeescriptmeteor
IanWhalen
IanWhalen

Reputation: 821

How do I pass a reactive array around the client context in Meteor?

I'm trying to create a reactive array similar to that seen here (How can I make a reactive array from a Meteor collection?) but the solution isn't working as expected.

The code below creates an array and updates it properly, but any subsequent updates to the 'foo' collection are not seen by the typeahead. I've also tried using the jquery-ui autocomplete but with the same result.

@Coll = new Meteor.Collection "foo"

if Meteor.isClient
  Template.myForm.rendered = ->
    Meteor.defer ->
      $('.inputs').typeahead
        source: Template.myList.test()

  Meteor.autorun ->
    Template.myList.test = ->
      _(Coll.find().fetch()).pluck "Name"

I'm guessing the problem is related to the fact that I'm relying on the fairly hacky "Template.myList.test" to store the array. I tried using the following:

Meteor.autorun ->
  test = _(Coll.find().fetch()).pluck "Name"

but the typeahead wasn't able to find "test".

As such, it's possible that the solution here will be to change how I'm storing the array rather than changing how the find() is executed.

Upvotes: 0

Views: 859

Answers (2)

Andrew Mao
Andrew Mao

Reputation: 36900

If you want an array to be reactive, you should probably be using a Meteor collection. Reactive updates to Arrays are horribly inefficient because the entire array gets changed with a change to a single element.

In general however, autocomplete solutions in Meteor shouldn't depend on static arrays like in traditional code. I encourage you to try out my Meteor-aware autocomplete package that is built specifically on top of meteor collections:

https://github.com/mizzao/meteor-autocomplete

Upvotes: 1

Tarang
Tarang

Reputation: 75945

Use Session

Meteor.autorun ->
  Session.set 'test', _(Coll.find().fetch()).pluck "Name"

Template.myList.test = ->
  Session.get 'test'

Upvotes: 0

Related Questions