Doesn't work with latest ember-cli (0.1.7)

[codepreneur]

If I just run ember new testlistview and then in templates/index.hbs:

{{#collection Ember.ListView contentBinding="controller" height=500 rowHeight=50 width=500}}
  {{name}}
{{/collection}}

and in routes/index.js:

import Ember from 'ember';

    export default Ember.Route.extend({
      model: function() {
        var items = [];
        for (var i = 0; i < 10000; i++) {
          items.push({name: "Item " + i});
        }
        return items;
      }
    });

I get an error:

Uncaught Error: Assertion Failed: Ember.ListView must be a subclass or an instance of Ember.View, not

 DEBUG: -------------------------------
 DEBUG: Ember      : 1.8.1
 DEBUG: Ember Data : 1.0.0-beta.12
 DEBUG: Handlebars : 1.3.0
 DEBUG: jQuery     : 1.11.2
 DEBUG: -------------------------------

Does anyone know how to make it work or can offer any alternatives?

Also, what about Ember 1.9.1 and Handlebars 2.0.0 ?

http://stackoverflow.com/questions/28026627/ember-listview-doesnt-work-with-latest-ember-cli-0-1-7

[stefanpenner]

seems like you are missing the list-view global, does the component form of {{ember-list}} not work for you?

I am using this in my app without trouble, i'll try to see if i can reproduce your issue

[codepreneur]

If I use {{ember-list}} i.e. :

{{#ember-list items=controller height=300 width=500 row-height=100 element-width=100}}
  {{name}}
{{/ember-list}}

then I get the following error:

Uncaught Error: <something@view:default::ember318> Handlebars error: Could not find property 'ember-list' on object (generated index controller).

I am on:

ember -v
version: 0.1.7
Could not find watchman, falling back to NodeWatcher for file system events
node: 0.10.35
npm: 2.1.8

And I have Mac OS X Yosemite. Version 10.10

Also, based on the error I get, it seems that Ember.ListView is dependent on Ember Views and they are going to be deprecated in Ember 2.0 hence how is this going to affect Ember.ListView, 2.0 onwards?

[xrl]

I can confirm this issue as well. I tried starting up the server with a debugger statement at the top of https://github.com/emberjs/list-view/blob/master/packages/list-view/lib/main.js and it never triggered when starting the app (I restart the ember serve process so it would reload libraries). Is the issue that I added list-view from bower when it should have been added from npm?

This is my bower.json:

  "dependencies": {
    "handlebars": "~1.3.0",
    "jquery": "^1.11.1",
    "ember": "1.8.1",
    "ember-data": "components/ember-data#canary",
  [[ SNIP ]]
    "list-view": "emberjs/list-view#master"
  },

Reading over how ember-cli addons are processed, http://reefpoints.dockyard.com/2014/06/24/introducing_ember_cli_addons.html, should the list-vew package.json have a ember-addon tag?

[SebastianSzturo]

Also not working for me. Anyone figured this out?

[codepreneur]

Andrew Hacking did on my stack overflow question (I am citing):

I've just forked the ember-cli-list-view and ember-list-view-component to get it working with the latest Ember CLI 0.1.7 and Ember 1.9.1 with handlebars 2.0.0.

I needed to use the latest master version of Ember ListView. I intend to raise a PR against the ember-cli-list-view package, but in the meantime, my fork of the add-on is available here: https://github.com/ahacking/ember-cli-list-view

You can install it by adding the following to package.json:

{
  "devDependencies": {
    "ember-cli-list-view": "ahacking/ember-cli-list-view#0.0.6-alpha.1"
  }
}

Then run npm install.

You won't be able to use ember generate ... since Ember CLI doesn't currently support adding bower packages at a URL. Instead you will need to add the ember-list-view-component package and zynga scroller to bower.json manually:

{
"dependencies": {
"ember-cli-list-view": "ahacking/ember-list-view-component#0.0.6-alpha.1",
"zynga-scroller": "https://raw.github.com/zynga/scroller/master/src/Scroller.js",
"zynga-scroller-animate": "https://raw.github.com/zynga/scroller/master/src/Animate.js"
}
}
Then run bower install.

You will then need to add the following to Brocfile.js:

app.import("bower_components/zynga-scroller/index.js");
app.import("bower_components/zynga-scroller-animate/index.js");

Providing you have followed the above instructions precisely, you can then use Ember ListView and VirtualListView as follows:

// app/views/my-list-view.js
import Ember from 'ember';

// can also use Ember.VirtualListView (for iOS scrolling support)
export default Ember.ListView.extend({
  height: 500,
  rowHeight: 30,
  itemViewClass: Ember.ListItemView.extend({
    templateName: "some-item-template"
  })
});

[tim-evans]

@codepreneur master is currently updated to work as an addon. Could you test to see if the current version works for you? If not, we can add another item to ember-try for your particular version. Thanks!

[stefanpenner]

works now (although it depends on ember 1.11.1 which will be released with ember-cli shortly