I am making an Angular 12 application, and I need change ngModel value via global/window method. (Because Android Webview can call from kotlin only public javascripts methods)
I'm tried use bind, and angular service. Method is called correctly, but ngModel not changed - input not filled.
Via bind, see on Stackblitz, or via service, see on Stackblitz too.
Unfortunately, the input is not filled in in any case. You can try on Stackblitz, via browser console.
So I need to update the ngModel value, but how?
You can fire a custom event as mentioned in this answer
I've updated your code to use custom event here StackBlitz
From console tab,
window.dispatchEvent(new Event('custom-event'));
Related
I'm using AWS Cognito in my system and I have an user pool created from a template with some custom attributes.
I have a lambda, called sendMessage, that is trigger when a sign up occurs to send an email to the user.
What I want: I need to pass an attribute (like a flag) from the sign up lambda to the sendMessage lambda using the lambda event.
The problem is: that attribute I need to pass it's not defined in the template, because it's not needed in Cognito.
I tried to use the UserAttributes option from aws-sdk but it didn't work.
I'm assuming that's because Cognito just ignored it, since it's not in the template.
My question is: is there a way to pass that attribute in the event?
UPDATE: I tried to use the ClientMetaData as the sdk docs says, but it didn't work as well (I've got undefined instead)
UPDATE 2: I also tried this workaround but still nothing
I have an odd necessity at my current project. I am using Semantic-Ui as a front-end framework.
One of my views includes semantic-ui dropdown component and this component gets it's datas from remote source. What I need is to call remote source manually. When I start texting, dropdown component calls to remote api and get datas back nicely, but I failed at triggering calls manually.
My question is, how can i call remote content at dropdown's onchange event.
My current code is (#searchInput is id of my input):
onChange: function (val) {
$('#searchInput').trigger('change');
}
Thanks for your helps and kind
Is there a possibility to access and set the state and props of an existing React component through the browser (from inside another script or through console)?
I know there is a way with Angular to access the scope and change variables, but with React I haven't been able to find a way.
I would assume there must be some way because the React Developer Tools extension from Facebook is able to get all the information (Props, State, Component, Event Listeners) from the React components on the page, with the possibility to change them.
If there is a possibility to do this through JavaScript, which would be the way to do it?
If you have the React devtools extension, you can access the React scope via your browser console with $r.
First, select the component you wanna act on in the React devtools tab:
Then, use $r to act on the component, for example read state with $r.state or set state with $r.setState({ ... }) :
To set a react components's state from the browser, you can bind a function to the window object that will trigger the set state.
In the react component's constructor, you can do this.
constructor (props){
super(props);
window.changeComponentState = (stateObject) => {
this.setState ({stateObject});
}
}
In the browser console you can do this.
window.changeComponentState ({a:'a'});
WARNING: This is anti-pattern. This will work, but you should never never do this.
To set the state from your browser, stick this somewhere in your component, like in render():
globalSetState = function(state){this.setState(state)}.bind(this);
Note: It's important to leave off the var, as this is what makes the defined function globally accessible.
You can now call globalSetState({x: 'y'}) in your console.
Warning: This is mad ugly, and, like console.log() for debugging, should be deleted in your live app.
When back home is pressed app exists but it is not terminated yet.
When user press primary or secondary tile app is relauched.
Default way is to let application navigate to the last visited page in the navigation history.
I don't know if there is a bug but this way doesn't work as expected because any code inside page ready function executes but it doesn't count later when page is rendered. Static binding works but not dynamic.
I need to know what is the proper way of handling relaunch in an app that uses default navigation template?
What to do if I want clean start, destroy everything and than navigate to home?
How to overcome problem with framework not taking into consideration code inside page ready function?
Upon app initialization you should check for the ApplicationExecutionState, and do whatever you want in either case.
Thanks for your answer but it is quite clear from the start how to obtain ApplicationExecutionState.
Actually what I need was to execute all bindings and other post processing after DOM has been loaded in a promise timeout.
if (app.sessionState.previousExecutionState === 1) {
WinJS.Promise.timeout().then(function () {
performeAfterProcessing();
});
}
else {
performeAfterProcessing();
}
So if everyone encounters some strange behavior after application has been relaunched try to execute your code using promise timeout.
Is it possible to somehow override the login method of the Secure.java class of the Secure-Module in Play! Framework, so that another version of the login form is displayed?
In my case, i want to display a mobile version of the login-form if a mobile browser is detected.
I know i should not change the Secure.java class itself, but i don't really see any other solution to this problem.
As discussed in other posts you have the request in your Play! controller. So in this request you could ask which agent is trying to view your website:
String agentInfo = request.headers.get("user-agent");
The you can determine which template will be rendered for this agent:
if (agentType.isWhatEverHeIs) {
renderTemplate("Application\mobileTemplateForBadPractise.html");
} else {
render();
}
But what I would encourage you to do is responsive webdevelopment. Create your templates as smart as possible, let the template and css and javascript do this and keep your business logic in your controller.
You could use the Twitter Bootstrap to achieve this, but there are many more! Like Skeleton.
You even got the request object inside your templates so that you can optionally render things in your template (or not) based on the agent.
Even simpler, simply create/override the secure/login.html template and use responsive design : media queries. No need to change the controller or check agent or whatever.