CODEWITHSUNDEEP
ember.js
SuperMarco
SuperMarco

Reputation: 721

Emberjs - Pass an object from the view to controller

I am using a radialProgress as a jQuery plugins (homemade), and I need to implement it for ember but I have some issue to do that.

Quick explanation for the plugins :

var chart = $(yourElement).pieChart(options); // initialise the object to an element
chart.setCompleteProgress( complete, false ); // set how many item you have to complete the task
chart.incrementProgress(); // increment + 1 every time you call it

It's a very simple progress pie.

In my case my task are located inside my controller, but the chart as to select a dom element so I need to initialise it inside my view. My task in the controller are called from the router from the setupController to reload the model over time.

Here is a small sample of what I would like to do : 

App.ApplicationRoute = Ember.Route.extend({
    setupController: function(controller) {
        var promise = controller.getModel();
        this._super(controller, promise);
    }
})

App.ApplicationController = Ember.ArrayController.extend({

    getModel: function() {
        // chart.setcompleteProgress();
        // A lot of code are here to get some data
        // chart.incrementProgress();
        return newModel;
    }
})

App.ApplicationView = Ember.View.extend({
    didInsertElement: function() {
        var chart = $(element).pieChart(opts);
    }
})

I don't know how to pass the chart object from the view to the controller to be able to have access to my plugin function.

Upvotes: 0

Views: 63

Answers (1)

Kingpin2k
Kingpin2k

Reputation: 47367

Che chart won't be inserted into the DOM until the didInsertElement therefore you can't attempt to manipulate it in the route during setupController etc. I'd suggest creating a method in the controller setupChart and calling that on didInsertElement. 

App.ApplicationView = Ember.View.extend({
    prepPieChart: function() {
        var chart = $(element).pieChart(opts);
        this.get('controller').setupPieChart(chart);
    }.on('didInsertElement')
})

App.ApplicationController = Ember.ArrayController.extend({

    setupPieChart: function(chart) {
       chart.setcompleteProgress();
        // A lot of code are here to get some data
       chart.incrementProgress();
    }
})

All that being said, maybe it belongs in the view, but I'm not sure of what you're completely doing.

Upvotes: 1

Related Questions