cancel
Showing results for 
Search instead for 
Did you mean: 
cancel
Showing results for 
Search instead for 
Did you mean: 

Community Tip - Visit the PTCooler (the community lounge) to get to know your fellow community members and check out some of Dale's Friday Humor posts! X

Add js file into home.js

RB_10104920
4-Participant

Add js file into home.js

I am currently using the method :

$scope.app.fn.loadResourceScript("app/resources/Uploaded/btnMult.js"); //On community was told that is a method to import modules from Uploaded.

 

then ,to connect the modulo function to the $scope i did:

$scope.mult=function(x){

mult(x)
}

 

the file "btnMult.js" ,contains :

function mult(x){

return x*x

}

 

There is nothing more on the file, but when i run the file ,i got an error ,telling "mult is not defined" 

 

Can somebody give me a help? I did every option that are related on importing but nothing works...

 

1 ACCEPTED SOLUTION

Accepted Solutions

Hi @RB_10104920 ,

I never used the mentioned api but I loaded scripts fromt the Upload project folder (or subfolders ) using following scripts:

 //---------------Loading the API----------------------- 
$scope.asyncLoadScript = function (fname) {
  return new Promise((resolve, reject) => {
    if(fname) { var head = document.head || document.getElementsByTagName('head')[0],
                script = document.createElement('script');
      script.async = true; script.onload = resolve;
      script.onerror = reject; script.type = 'text/javascript';
      script.src=fname;  head.appendChild(script); } });}

var mathe =undefined;
//////////////////////////////////////////
$scope.mathModuleLoad = function() {
console.log("mathModuleLoad started"); 
var mathe =undefined;
$scope.asyncLoadScript("app/resources/Uploaded/MyMathFunc.js").then(
 function() { console.log("myMathFunc was loaded successfully") ;TESTLOAD();}, 
     function() { console.log("error for when loading myMathFunc.js module");} );
}
//
$scope.mathModuleLoad(); //LOAD dhere the myMathFunc.js for

The example code above loaded e.g. my math js module

Here another version which will load both js or css files from project folder:

$scope.loadjscssfile= function(filename, filetype){
    if (filetype=="js"){ //if filename is a external JavaScript file
        var fileref=document.createElement('script')
        fileref.setAttribute("type","text/javascript")
        fileref.setAttribute("src", filename)
    }
    else if (filetype=="css"){ //if filename is an external CSS file
        var fileref=document.createElement("link")
        fileref.setAttribute("rel", "stylesheet")
        fileref.setAttribute("type", "text/css")
        fileref.setAttribute("href", filename)
    }
    if (typeof fileref!="undefined")
        document.getElementsByTagName("head")[0].appendChild(fileref)
}
 
//loadjscssfile("app/resources/Uploaded/myscript.js", "js") //dynamically load and add this .js file
//$scope.loadjscssfile("app/resources/Uploaded/style1.css", "css")

 

View solution in original post

3 REPLIES 3

Hi @RB_10104920 ,

I never used the mentioned api but I loaded scripts fromt the Upload project folder (or subfolders ) using following scripts:

 //---------------Loading the API----------------------- 
$scope.asyncLoadScript = function (fname) {
  return new Promise((resolve, reject) => {
    if(fname) { var head = document.head || document.getElementsByTagName('head')[0],
                script = document.createElement('script');
      script.async = true; script.onload = resolve;
      script.onerror = reject; script.type = 'text/javascript';
      script.src=fname;  head.appendChild(script); } });}

var mathe =undefined;
//////////////////////////////////////////
$scope.mathModuleLoad = function() {
console.log("mathModuleLoad started"); 
var mathe =undefined;
$scope.asyncLoadScript("app/resources/Uploaded/MyMathFunc.js").then(
 function() { console.log("myMathFunc was loaded successfully") ;TESTLOAD();}, 
     function() { console.log("error for when loading myMathFunc.js module");} );
}
//
$scope.mathModuleLoad(); //LOAD dhere the myMathFunc.js for

The example code above loaded e.g. my math js module

Here another version which will load both js or css files from project folder:

$scope.loadjscssfile= function(filename, filetype){
    if (filetype=="js"){ //if filename is a external JavaScript file
        var fileref=document.createElement('script')
        fileref.setAttribute("type","text/javascript")
        fileref.setAttribute("src", filename)
    }
    else if (filetype=="css"){ //if filename is an external CSS file
        var fileref=document.createElement("link")
        fileref.setAttribute("rel", "stylesheet")
        fileref.setAttribute("type", "text/css")
        fileref.setAttribute("href", filename)
    }
    if (typeof fileref!="undefined")
        document.getElementsByTagName("head")[0].appendChild(fileref)
}
 
//loadjscssfile("app/resources/Uploaded/myscript.js", "js") //dynamically load and add this .js file
//$scope.loadjscssfile("app/resources/Uploaded/style1.css", "css")

 

Ty Roland =D  worked

Superb!

Very helpful 😀

Top Tags