Qlik Community

Qlik Sense Integration, Extensions, & APIs

Discussion board where members can learn more about Integration, Extensions and API’s for Qlik Sense.

Announcements
BI & Data Trends 2021. Discover the top 10 trends emerging in today. Join us on Dec. 8th REGISTER
cancel
Showing results for 
Search instead for 
Did you mean: 
Highlighted
Creator III
Creator III

Injecting qlik into external controller for extension

Hi all,

I have to admit, I'm not really very confident about how requirejs works - particularly as I am trying to create my own javascript modules to organize my script. Here's the specific issue.

I am building an extension. I would like to keep my controller in a separate js file from the main js file. I need the "qlik" object in the controller. So the main js file will look something like this:

import myController from './myController.js';

export default window.define( [

    'qlik'

],

    function (qlik) {

        'use strict';

          return {

            definition: {},

            initialProperties: {},

            controller: myController

This all works fine and imports successfully from myController, but I don't know how to get 'qlik' into myController so that I can use its functionality there. For example, if this is the body of myController.js, qlik isn't available.

export default ['$scope', '$element', function($scope, $element){

  $scope.hello = "hi";

  console.log("hello", qlik); // hello displays, but qlik is empty

This doesn't work either:

export default ['$scope', '$element', 'qlik', function($scope, $element, qlik){

Nor does using the ES6 import, it can't find the module:

import {qlik} from 'qlik';

I am using the AxisGroup's qext extension boilerplate code (uses Webpack to transpile ES6)

https://github.com/axisgroup/qExt

1 Solution

Accepted Solutions
Highlighted
Partner
Partner

Jon. See my response to your question GitHub here https://github.com/axisgroup/qExt/issues/2

View solution in original post

5 Replies
Highlighted
Partner
Partner

Hello Jonathan,

is it possible to export a "creator"-function from controller.js? E.g:

controller.js:

export default function(qlikEngine){

  return ['$scope', '$element', function($scope, $element) {

    qlikEngine.theme.apply('abc');

  }]

};

extension-template.js:

...

import createController from 'controller.js';

export default window.define(['qlik'], function(qlik) {

  return {

    initialProperties: initialProperties,

    template: template,

    definition: definition,

    controller: createController(qlik),

    paint: paint,

    resize: resize

  }

});

Cheers,
Mathias

Highlighted
Partner
Partner

Jon. See my response to your question GitHub here https://github.com/axisgroup/qExt/issues/2

View solution in original post

Highlighted
Creator III
Creator III

Grazie John,

That worked, and thanks for being responsive over on Github, sometimes you never here from folks over there.

Highlighted
Creator III
Creator III

John's answer is the most straightforward, but yours may come in handy at some point as well. Thank you for taking the time.

Highlighted
Creator III
Creator III

jabellizzi

If you are still around here (I don't want to clutter up your Github issues section), I have another question.

I am trying to use the async / await functionality in ES6. I have a class with an async method and an await keyword on a function that returns a Promise. Seems to work fine in my up-to-date chrome; however, in Qlik Sense Desktop, which presumably is not using the latest Chrome, I get an error (unexpected identifier for async).

Do you know if there is a way to get some kind of polyfil into the webpack pipeline so that we can use this syntax, or is it just better to avoid for now?

Jonathan