Quantcast
Channel: JavaScriptMVC Forum
Viewing all articles
Browse latest Browse all 3491

Re : Listen to custom events in can.Component?

$
0
0
Sorry, I really new to js world, so forgive my dumb questions :) 
Yes, i can listen to changes in can.model.list, or params beeing passed to view containing component tags but how?

here is the code of my control

  1. define(['can', 'jquery', 'moment', 'models/flightsModel', 'components/resultsListComponent'], function(can, $, moment, FlightsModel){

  2.     var FlightsController = can.Control.extend({
  3.             //skipped defaults and nonrelated stuff

  4.             priceSortedList: new can.List(),
  5.             timeSortedList: new can.List(),
  6.             originList: new FlightsModel.List(),
  7.             searchHistory: new can.List(),

  8.             init: function(el, opts){
  9.                 var _this = this;

  10.                 can.view('views/results.mustache', {}, function (frag) {
  11.                             _this.options.elementSearchResults.html(frag);
  12.                             $(_this.options.elementPrice).append(can.view('views/results-list.mustache', {recs: _this.priceSortedList}));  
  13.                             $(_this.options.elementTime).append(can.view('views/results-list.mustache', {recs: _this.timeSortedList}));                                                 
  14.                 });                                  
  15.             },

  16.             search: function(query, filterChain){
  17.                 var _this = this;

  18.                 FlightsModel.findAll(query,
  19.                     //success 
  20.                     function(flights){
  21.                           _this.originList.replace(flights);
  22.                               
  23.                         _this.setFilterChain(filterChain);

  24.                         _this.priceSortedList.replace(_this.originList.sortedByPrice());
  25.                         _this.timeSortedList.replace(_this.originList.sortedByTime());
  26.                     }
  27.                   ....
  28.                   //skipped
and here is component

  1. define(['can', 'lodash', 'jquery', 'moment', 'models/flightsModel', 'jquery.hoverIntent'], function(can, _, $, moment, FlightsModel) {
  2. can.Component.extend({
  3. tag: "results-list",
  4.         scope: {
  5.                       list: FlightsModel.List(),
  6.                   ...
  7. events: {
  8. "{list} change": function () {
  9.        console.log('change fired');
  10. }, 

Viewing all articles
Browse latest Browse all 3491

Trending Articles