-1

The options for chart are not coming. $onChanges method is not getting invoked. There is no compilation error though. I have executed the same without es6 convention. When I have converted this into es6 classes, I am facing this issue. Please help...

class chartController{

    constructor(dashboardService){
        this.dashboardService = dashboardService;
    }

    $onChanges(changes) {
        console.log(changes);
        if (changes && changes.options.currentValue) {

          this.lineChartOptions = dashboardService.options.getLineChartOptions();
            console.log("calling updateLineChartOptions");
            updateLineChartOptions();
        }
    }
    updateLineChartOptions() {

        angular.extend(this.lineChartOptions, this.options);
        this.lineChartOptions.bindingOptions = {
            'dataSource': '$ctrl.options.dataSource',
        };

        this.lineChartOptions.valueAxis = {
            valueType: 'numeric'
        };
    }
}

class ChartComponent{
    bindings = {
        $transition$: '<', options: '<'
    };
    controller = chartController;
    templateUrl = 'views/chart.html';
}

app.component('chart', ChartComponent);
georgeawg
  • 48,608
  • 13
  • 72
  • 95
Swatantra Mukherjee
  • 21
  • 6
  • 2
    There is no good reason to use class for component object. You should use object literal for that. – Rannie Aguilar Peralta Apr 26 '19 at 11:19
  • While the example `ChartComponent` class may work in some browsers, it is not legal ES6 class syntax. As of 24April2019, public class fields is an [ECMAscript Draft proposal](https://tc39.github.io/proposal-class-fields/) for which the [proposal](https://github.com/tc39/proposal-class-fields) is at [Stage 3](https://tc39.github.io/process-document/) maturity. – georgeawg Apr 26 '19 at 17:57
  • how can I convert this function below into es6 function? ```this.dataGridOptions.onRowClick = function (e) { //console.log(e); if (this.options.onRowSelected) this.options.onRowSelected(e.data); };``` – Swatantra Mukherjee Apr 30 '19 at 04:16
  • Comments should only be used to clarify an existing question. Code in comments is difficult to read. Please put it in a [new question](https://stackoverflow.com/questions/ask). – georgeawg Apr 30 '19 at 15:36

1 Answers1

2
const ChartComponent = {
    bindings: {
        $transition$: '<',
        options: '<'
    },
    controller: chartController,
    templateUrl: 'views/chart.html',
}

app.component('chart', ChartComponent);

The .component method of an angular.module instance requires an object for its second argument, not a class (or function).

For more information, see

georgeawg
  • 48,608
  • 13
  • 72
  • 95
  • how can I convert this function below into es6 function? ```this.dataGridOptions.onRowClick = function (e) { //console.log(e); if (this.options.onRowSelected) this.options.onRowSelected(e.data); };``` – Swatantra Mukherjee Apr 30 '19 at 04:14