I am creating very basic ionic app. I want to show splash, then admob interstitial and on close of interstitial, i want to redirect to home page.
The only problem which I am facing here is updating the view in the home page. In home page, i have very simple text box and button. I am using 2 way data binding here and its not working at all.
I have created repo for this if somebody wants to have a look and let me know why the view is not updating.
https://github.com/krishnaa99/admobissue
Demo Video
https://www.youtube.com/watch?v=t_BKJ1mGpag
if the value is changing in component but not in view(html) then after action in component use this.
import { ChangeDetectorRef } from '#angular/core';
constructor(private changeRef: ChangeDetectorRef){}
this.changeRef.detectChanges();
i hope it can help.
Possible solutions you can try
you should check the logs for errors
Assign clear type to "input" variable. ( try making it explicitly
public )
"input" may be considered as a keyword, try using a different
variable name ( less likely )
Related
I am making a game where you must open or activate the UI with the space bar. Now, this works perfectly fine, but it is pretty annoying that every time you open the UI you must click on the inputfield to write in it. Is there any way around this? So is there a way to open or activate the UI without having to click on the field to be able to write in it?
I looked for YouTube videos and tried to find similar problems in other forums, but wasn't able to find a script, nor was I able to find some Unity settings to do so.
You could use e.g.
private class SelectOnEnable : MonoBehaviour
{
private void OnEnable()
{
EventSystem.current.SetSelectedGameObject(null);
EventSystem.current.SetSelectedGameObject(gameObject);
}
}
and attach it to whatever object that should become the selected one everytime it is enabled. See EventSystem.SetSelectedGameObject
Can't test it right now but it might still require the User to hit Enter in order to also actually set the Input field into edit mode. The upper line only sets it as selected UI element (similar to using TAB in a browser).
Otherwise I think you would go through
yourInputField.DeactivateInputField()
yourInputField.ActivateInputField();
to directly set it active. See InputField.ActivateInputField. Might have to do both in combination - again can't test right now ;)
Thank you very much, derHugo! Everything works like a charm now! You saved me a lot of time. Referring to your last comment, I used both of them, and it seems to work very well for me. Here is the code I used:
`private void OnEnable()
{
EventSystem.current.SetSelectedGameObject(gameObject);
GameManager.GetComponent().inputFieldInMainUi.ActivateInputField();
EventSystem.current.SetSelectedGameObject(null);
GameManager.GetComponent<InputFieldComparision>().inputFieldInMainUi.DeactivateInputField();
}`
I have a Home Page, inside that I have created one component RecentlyViewedProductComponent.
My problem is:
when I navigate to /home by using
this.router.navigate(['/home']);
the ngOnInit() inside RecentlyViewedProductComponent is not working. When I close the app and open it again, that only it is working .
How to solve this problem?
It sounds like you are not using the right lifecycle event.
Have you looked at the documentation here:
https://ionicframework.com/docs/angular/lifecycle
It says that ngOnInit() is:
Fired once during component initialization. This event can be used to initialize local members and make calls into services that only need to be done once.
If you want it to be called every time you navigate to the home page then you want to replace this with something like ionViewWillEnter():
Fired when the component routing to is about to animate into view.
There is actually some guidance at the end of the docs page that you might find interesting which explains when to use each life cycle method.
I have recently upgraded to ionic 3 implementing the IonicPageModule for navigation. The push and setRoot works for all navigating however i am stuck at the trying to reference the pages in the app.component.ts
Normally i would reference the page from the import like so
this.rootPage = user ? ProgramsPage : LoginPage;
Where LoginPage and ProgramPage are declared in the app.module.ts
However in the new angular 4 / ionic 3 setup references to the "pages" are referenced with strings without an import in the related page.ts and seemly integrated with the navCtrl's push and set
I have tried
import { LoginPageModule } from '../pages/login/login.module';
But that does not make sense.
I figured the whole point of creating modules per page was to firstly enalble lazy loading but also minimize the import code on pages without having to create a config export class.
And the thing is you cannot declare the LoginPage twice and seeing as though it is already declared as a module through the IonicPageModule one cannot add that export class again.
So just wondering how do you reference a ionic 3 page module when you want to apply logic?
I came across an article that implemented close to what you really wanted; though it talked more about cloud functions but at the beginning it tried to solve your problem in a very fashionable way. Take a look https://javebratt.com/firebase-cloud-functions-profile/
if your pages are being declared as:
/* imports and stuff here ... */
#IonicPage()
#Component({
selector: 'page-user',
templateUrl: 'user.html'
})
export class UserPage { /* constructor, your code & else ... */ }
or generated using the ionic-cli by running: ionic g page NewAppPage
you will be able to use the string page name instead of using the page object (that also requires you to import the page).
Take a look at https://www.javascripttuts.com/ionic-3-new-pages-lazy-loading/ , it may help you understand a little bit more about lazy loading and pages inside the app component.
I am trying to make a function so that I request a 'manager override' where it presents a screen for a manager to enter their password and press an approve button. How should I do this? Will it have to be in multiple functions? Is there a way that I can call one function and it present the information back? Would a completion work for what I need? I have no ideas where to start for this.
My set up is as follows:
A view controller asks for manager approval, then a screen slides up with text boxes and an approve button. I want the approve button to trigger authenticating and dismissing the screen
Assuming you don't want a Framework target (that sounds like overkill for what you want) simply mark the function as "public" and move it outside of any class. I just tried in a sample project and it works.
It looks important - remember to keep it in a file already in the project. (My sample project didn't work with menu option File|Add|New|File.)
Now, if you really want portability, check out how to create a Framework project.
I am creating an App with Ionic2 and the requirement is -
- the app when first loaded will show a Log In page and when logged in
- will have a Side-Menu enabled pages
The starter project shows that the Side Menu as the root of the app and loads first before any other page is open - then it loads the other related pages.
How can I build an app that Loads Log In page first and then set the Side Menu as the main navigation and never shows up the Log In screen??
I did this with ionic 1 but not being able to figure out with ionic2
Please help.
One solution would be to disable menu on Login screen and then to enable it after login.
You can disable menu by injecting MenuController and then use:
import {NavController, MenuController} from 'ionic-angular';
ionViewDidEnter() {
//to disable menu, or
this.menu.enable(false);
}
ionViewWillLeave() {
// to enable menu.
this.menu.enable(true);
}
#Digital IQ, you have to set your login page as the rootPage in your existing app.ts file and use MenuController in login page to make menu enable onPageDidLeave.
The example for this is available in ionic conference app where they have tutorial page before getting in to the actual application. Refer this for menu control and this (line 50) to set the initial page.
The above problem must have occurred because the user had surely logged in, but the changes i.e. setting it as the current user didn't take place in side menu page.
For that you can use Events API
Events is a publish-subscribe style event system for sending and responding to application-level events across your app.
For reference, go through the following answer-
Ionic 3 refresh side menu after login
kind Attn [vahid najafi & Aish123]
I tried something more easy and I found it working.
I set the LogIn page as the root when the app first loaded - and I removed 'menuToggle' button from this template.
Then I imported the Component I want to redirect on Log in
I created a singIn function in LogInPage class as follows:
signIn (){
let navRef = this.app.getComponent('nav');
navRef.setRoot(HelloIonicPage);
}
and it worked like a charm