TransWikia.com

RequireJS : Load and start main ViewModel with TypeScrypt

Stack Overflow Asked by BokC on December 25, 2021

I’m new on requireJs.
I would like to load viewmodel from my main script : App.ts and get a new instance of my viewModel : LienPdtUfActVM.ts.

My App.ts file:

declare var jQuery: JQueryStatic;
declare var $test: any;

(function ($, $test) {
    if (typeof ($test.module.Livret) == 'object') {
        return;
    }

    $easily.module.Livret = {
        init: function (data) {
            var LienPdtUfAct = require(["./Livret/ViewModel/LienPdtUfActVM"]);
            ??????
        },
        destroy: function (applicationId) {
        }
    };
})(jQuery, $test);

My LienPdtUfActVM.ts :

export class LienPdtUfActVM {
    constructor() {
    }
}

I don’t understand how to get this new instance.

My tsconfig.json :

{
    "compilerOptions": {
        "noImplicitAny": false,
        "noEmitOnError": true,
        "removeComments": false,
        "sourceMap": true,
        "target": "es2015",
        "module": "amd"
    },
    "compileOnSave": true
}

Try :

I try this :

import LienPdtUfAct = require('./Livret/ViewModel/LienPdtUfActVM');
....
new LienPdtUfAct.LienPdtUfActVM();

TypeScrypt compiler say ok but at the execution I get an "Uncaught Error: Mismatched anonymous define() module: function (require, exports, LienPdtUfAct) {…" error. The LienPdtUfActVM.js file was not loaded.

2 Answers

This code run :

$test.module.Livret = {
    init: function (data) {
        require(["./Livret/ViewModel/LienPdtUfActVM"], (LienPdtUfActVM) => {
            myInstance = new LienPdtUfActVM.LienPdtUfActVM();
        });
    },
    destroy: function (applicationId) {
    }
};

Answered by BokC on December 25, 2021

You do it like this:

declare var jQuery: JQueryStatic;
declare var $test: any;
var myInstance: any;

(function ($, $test) {
    if (typeof ($easily.module.Livret) == 'object') {
        return;
    }

    $easily.module.Livret = {
        init: function (data) {
            var LienPdtUfAct = require(["./Livret/ViewModel/LienPdtUfActVM"]);
            myInstance = new LienPdtUfAct.LienPdtUfAct;
        },
        destroy: function (applicationId) {
        }
    };
})(jQuery, $test);

I'm not sure what else you need to do to "start" it, because I'm not sure what framework it uses. But that is how you create an instance of it.

Answered by Josh Wulf on December 25, 2021

Add your own answers!

Ask a Question

Get help from others!

© 2024 TransWikia.com. All rights reserved. Sites we Love: PCI Database, UKBizDB, Menu Kuliner, Sharing RPP