I encounter the problems of modal-backdrop hidekeep append in my ionic view.
I need to call modal for my code. In my case, if the students click to the button check the answer then the modal of marking status will comes out.
However, If I repeatedly answer a lot of questions, the modal-backdrop hide append everytime I click the button.
Is it anyway to clear the cache for the modal like in <ion-view cache-view="false"></ion-view>?
You need to use ionic modal remove instead of hide.. Refer this Ionic Documentation.
http://ionicframework.com/docs/api/service/$ionicModal/
Related
I have a classic dropdown menu on an Angular project with a main link always shown and a tree of sublinks shown only when hovering this one.
I have two events on the parent:
ng-mouseenter="vm.toggleDropdown($event)"
ng-mouseleave="vm.hideDropdowns($event)"
And they work perfectly fine. The main link has a simple:
ng-click="vm.navToState(item.urlState, $event)"
With a $state.go within to go to the string passed as parameter. On mobile devices, ng-mouseenter is being triggered on tap, showing the dropdown menu and this is perfect. The thing is that ng-click is being triggered too so the menu is only visible a fraction of a second before the next state loads. Is there any way to detect if ng-click is being fired by a touch event so I could add an if statement to navToState() and prevent the $state.go()? I understand that this way that main link would be unreachable in mobile but I'll take care of that adding an extra link within the dropdown.
Any other workaround for the same result is fine too.
Thanks!
Could you set a variable based on whether it is a mobile browser and use that as a check navToStart as to whether you state change or not, then have a separate state change function that doesn't care whether it's mobile or not so you can still change states in the mobile browser? That's one idea, but if it doesn't work, could be worth putting some code in your question for a reference.
Here's an answer on detecting mobile browsers:
https://stackoverflow.com/a/11381730/5349719
I have one problem with Ionic framework("version": "1.0.0-beta.1"), when I modify the Item I want to be able to modify the buttons related to the item swipe.
The scenario is : swipe on item, view a list of buttons [open,modify,close].
WHen i Click on Close I want to modify the option-buttons of Item with only the button [reopen].
It is possible in the controller change the option-buttons?
I have tried but the framework not reload the related buttons.
Do you have any hint?
Thank you
http://forum.ionicframework.com/t/ionic-ion-item-option-buttons-for-swipe-not-reload-the-updated-buttons/2590/5
I have opened a discussion for that in ionic forum.
ANd the solution is come from the new version.
Here is the example of new sintax.
http://codepen.io/anon/pen/nFmuc
In my AngularJS web application it is possible to create an item and save it. When the user clicks on the save button, the item is showed in the sidebar on the left.
I would like that when the item is saved, it will be highlighted for some seconds (e.g. background-color) so that the user can detect where it has been saved.
This is the button to save it.
<a class="pure-button pure-button-primary" ng-click="NewOrUpdateItem()">Save</a>
Need any other details?
any idea about this issue?
Thank you in advance.
You could use the ngAnimate module of angular. ngAnimate
see here for a working example
var module = angular.module("app", ['ngAnimate']);
....
I guess a proper answer will depend on your markup and list of items, if you could put a bin would be helpful. Anyway I have put this simple example together, maybe it could give you some ideas.
When a item is saved, $scope.saved is set to true and ngClass is used to create the highlight effect, then use $timeout to unset saved. I think a directive could be a better place for this logic.
Here is the JSBIN
User can update value for multiple rows in an nggrid using a modal window. After user confirms update and closes modal window, grid does not refresh. Navigating away from page and coming back indicates that the update took effect, but I want this to take effect right away, without having to use location.reload(). Any ideas?
If your modal is a directive I'm guessing (without having seen the code) that you need a $scope.$apply in the directive...
I'm using angular-ui bootstrap to show modal windows. I'd like to turn this into a directive that would let me pull content from the server and display it in a modal or popover…
For example: <a a-infobox="modal" href="#/content/one">A link</a> should get the content from the href and pull it into a modal window.
I pulled together a plunkr: http://plnkr.co/edit/cwtTHjMsW0knlsq2NNtg?p=preview. The first link has the a-infobox attribute. When I click on it no dialog shows up. In the console you can see that it was called.
When I click on the second link which is called from a controller, it opens the second dialog. Then when I click the button on that modal, it disappears and the dialog from the first click is right behind it.
I'm just starting to dig into directives and am sure I'm missing something fundamental.
Thanks in advance.
I found a solution...it appears that the modal needs to be applied so angular will process it on the next digest.
A simple line: scope.$apply($rootScope.dlg); is all it took.
The plunker was updated accordingly.