this.viewModel.item.destroy being defined as string?

For some reason, my can.Component (defined below) seems to be defining this.viewModel.item.destroy as a string instead of an actual destroy method. I get the following console message when attempting to call destroy:

feeds_page.js:98 Uncaught TypeError: this.viewModel.item.destroy is not a function(…)

 can.Component.extend({
    tag: 'syndicate-feed-subscription',
    template: can.view('existing_syndicate_feed'),
    viewModel: {
      item: null,
      page_config: null,
      current_view_state: null,
      application: "syndicate"
    },

    events: {
      init: function(){
        this.viewModel.attr('page_config', new can.Map({
          editing_feed: false,
          feed_saved: false
        }))
      },

      ".edit_feed_link click": function(el, ev){
        this.viewModel.page_config.attr('editing_feed', true);
        console.log("EDIT!");
        console.log(this.viewModel.page_config.editing_feed);
      },

      ".remove_feed_link click": function(el, ev){
        var destroy_def = this.viewModel.item.destroy();
        destroy_def.then(function(thing){
          console.log("Destroyed?");
        })
      }
    }
  });

Here is my this.viewModel.item according to the console

Any ideas?

What does your model look like?

I’m betting something like:

can.Model.extend({destroy: "DELETE /syndicate/..."})

Instead of:

can.Model.extend({destroy: "DELETE /syndicate/..."},{})
`

Wow, that was exactly it, thank you so much :smiley:

Should this also fix the same issue happening with an update call?

this.viewModel.item.update({id: id}); 

I’m having the same issue where I get an error that this.viewModel.item.update is not a function.

Figured this out. I apparently had to use this.viewModel.item.attr(id: id); and this.viewModel.item.save(); All’s well now :slight_smile:

1 Like