es6 'this' issue

ProductComponent.js

export default function ProductComponent() {
  return {
    template: '<product-list sort-function="vm.sort"></product-list>'
    controller: ProductController,
    controllerAs: 'vm'
  }
}

class ProductController {
  constructor(ProductService) {
    this.ProductService = ProductService;
  }
  
  sort(sortType) {
    // When executed from within ProductListComponent
    // 'this' is the this from inside ProductListComponent
    console.log(this, sortType);
    // getPRoducts returns a promise
    return this.ProductService.getProducts(sortType)
  }
}

ProductController.$inject(['ProductService']);

ProductListComponent.js

export default function ProductListComponent() {
  return {
    scope: {
        sortFunction: '&'
    },
    template: '<a href="#" ng-click="vm.sort(\'id\')">id</a>',
    controller: ProductListController,
    controllerAs: 'vm'
  }
}

class ProductListController {
  constructor() {
    this.sort = this.sortFunction();
  }
}