Call function from browser console in Angular

gabrielsalvador

I have a function inside an Angular component,lets say:

setDevMode(mode:string):void {
    this.devMode = mode;
}

How would I go about running it from the browser console?

ShamPooSham

To call a method from a component instance, you need to get a reference to the component instance. You can do that in Angular 9+ with the ng global variable, by using its getComponent function.

In order to use this, you need to have access to the html element created by your component instance. You can find it in the Elements tab in Chrome ("Inspector" in firefox), right click on the element and choose "Store as global variable" ("Use in console" in firefox). You now have a variable in the console that you can send to the getComponent function, for example temp1:

const myCompInstance = ng.getComponent(temp1)

component With this, you can now call the method like this:

myCompInstance.setDevMode("some_mode")

Notice that you will probably have to run ng.applyChanges on the element to see the UI update, like this:

ng.applyChanges(temp1)

Collected from the Internet

Please contact [email protected] to delete if infringement.

edited at
0

Comments

0 comments
Login to comment

Related

Call a service function from browser console in angular 6

How can I declare a global function to call an Angular service from the browser console?

Javascript function not defined when call from browser console

How to call a VueJS getter from browser console?

AngularJs : Call controller function bound to 'this' from outside(eg. Browser console)

Jest fails to call spy on async function, but function is called in browser console

Typescript: How to access function from browser console

Call winform function from IE browser

Call URL from console without opening in any browser

Call angular function from puppeteer

Angular Cli : disable live reload from browser's console

chrome - run javascript function from browser console "undefined"

Call function when browser is resized Angular 1.5 (components)

call a function in google console

GeckoFX browser: Call C# function from JavaScript

Call Node 'require' function from within browser JavaScript

Best Practice : Call a function from chrome dev console

Angular 2: Call function from a string name

How to call a PHP function from Angular 4

Call cloud function from angular app with parameters

angular call component function from outside

Call a function from an *ngIf Angular 5

call another function from onreadystatechange Angular 2

Angular: call function from other component

Angular 11 - Call parent function from child

Angular 9 call function from another component

Angular method call from a external control function

angular call function from append html

Call function from within angular factory