Tab select event is triggered when I am navigating away - angularjs

I am using the Tab directive and the select expression to trigger a method when the tab is loaded. But the event is also triggered when I am navigating away from the site. How can I avoid this?
I have created a small example on github.
https://github.com/mkeuschn/management-reporting
Behaviour:
When I use the Report link the tab event of the first tab is fired. OK
If I am navigating away from the report part (press the home button), then the event of the second tab is fired. NOK
regards,
Marko
Update
I have created a plunk: http://plnkr.co/edit/7NQwVGa7tpBDNRbIckZk?p=preview
Github Issue
https://github.com/angular-ui/bootstrap/issues/2155

I had the same problem with Angular-UI v0.11.2. After checking out related issue on github, i saw that it is fixed and merged into master branch.
I applied this patch and it worked as expected.

Related

Facebook pixel setup via GTM on a SPA(React) fires page view event twice

So like the title says, I'm using Google Tag Manager to send events to Facebook. Most events seem fine any only fire once, except the view page event. The event is setup to trigger using GTM's history trigger because we're using React for our site.
Originally it was setup to fire on all history changes, but I notice when using preview mode in GTM that there were two history changes being fired.
1: gtm.historyChange
2: gtm.history change-v2
So, I updated the trigger to only fire on some changes and set: Event equals gtm.historyChange With this change I now only see one history change in GTM preview mode, but I still see two in the fb pixel helper chrome extension. One Page event has the an event ID and params I want to see, the other has nothing.
I'm no analytics or pixel expert so even pointing to a possible reason why this is happening would be really helpful.
I believe that the Facebook pixel already considers history change as a page view, so you are double counting it by also triggering it on the history change. Just load it on page view only and it should resolve the issue.

Difference in order that ng-click and ng-change are fired between Angular 1.2 and Angular 1.6

Something happened between AngularJS 1.2 and 1.6 to reverse the order that ng-click and ng-change fire in.
I've made a plunk to illustrate it: http://plnkr.co/edit/XgbgLSuP1znhWszeyiHd?p=preview
The default for this page is to use Angular 1.2.28. In this case, if you change the radio buttons in the example, you'll see the click event fires before the change event.
If you then switch the comments so that Angular 1.6.10 is used, you'll see the change event now fires before the click event.
What happened in the development of AngularJS to cause this, and is there any way to retain the former behaviour while using a more up to date version of AngularJS?
Thanks very much for any help you can give!
EDIT: I should probably say why this is important. I want to be able to inspect the value of the variable before it changes, in order to see whether the change should be allowed. I was able to do this using ng-click on AngularJS 1.2, but because ng-change is fired first on AngularJS 1.6, the change has already been made before I can decide whether it should go ahead. If you have other ideas as to how I can accomplish this with AngularJS 1.6, I'd be very interested to hear them.
Here is the summary of the behavior of different versions:
AngularJS V1.2 CLICK handler fires first
AngularJS V1.3 CHANGE handler fires first
AngularJS V1.4 CHANGE handler fires first
AngularJS V1.5 CHANGE handler fires first
AngularJS V1.6 CHANGE handler fires first
AngularJS V1.7 CLICK handler fires first
Code that depends on the order of events on an element lacks robustness. Write only robust code. Avoid fragile code that depends on unguaranteed features of a library or browser.
Use the ng-disabled directive on radio buttons to prevent choices.
From the Docs:
input[radio] and input[checkbox]
Due to 656c8f, input[radio] and input[checkbox] now listen to the "change" event instead of the "click" event. Most apps should not be affected, as "change" is automatically fired by browsers after "click" happens.
— AngularJS Developer Guide - Migrating to V1.7
ALSO
fix(input): listen on "change" instead of "click" for radio/checkbox …
…ngModels
input[radio] and input[checkbox] now listen on the change event instead
of the click event. This fixes issue with 3rd party libraries that trigger
a change event on inputs, e.g. Bootstrap 3 custom checkbox / radio button
toggles.
It also makes it easier to prevent specific events that can cause a checkbox / radio
to change, e.g. click events. Previously, this was difficult because the custom click
handler had to be registered before the input directive's click handler.
It is possible that radio and checkbox listened to click because IE8 has
broken support for listening on change, see http://www.quirksmode.org/dom/events/change.html
— Github commit #656c8f

md-on-select called on every md-tab during destroy

We are using angular-material's md-tabs to display information to the user.
Up until now we used an on-demand approach by adding
ng-click=vm.getForExampleDataForTab1(),
ng-click=vm.getForExampleDataForTab2()
and so on for each md-tab. But this solution has a problem that the first tab is displayed with no data because it doesn't get clicked by the user. So we switched to md-on-select instead. And that did the trick, the first tab was getting data and all was fine. Apparently. We then discovered in Chrome's Dev tools that when moving to another page in the app, all the other tabs that were not selected (the user didn't click on them to view the data) were called.
Did anyone encounter such a behaviour? It only happens when we used md-on-select, not ng-click on the tabs.
Thanks a lot,
ashilon

ng-click on table row does not always fire in Internet Explorer 11

I have a situation where an ng-click on a table row with ng-repeat inside a modal window. The click event has always fired in Chrome. Only once every so often, the click event does not fire in Internet Explorer 11.
Is this a known issue with any workaround?
Correction: the click event is firing, and the ajax call behind it is firing, but the results of the ajax call are IE's cached results rather than the results of the latest query.
I believe the problem is described in this question:
Better Way to Prevent IE Cache in AngularJS?

First click doesn't work after navigating to a page

I have a Silverlight application that is using the Navigation Framework. The page is never focused right after it is navigated too. So when I first click on a button, it does nothing (except focus the page). Only the second click after navigation works. I use a subclass of the Page and have hooked the GotFocus event. It is never called. I've also tried to call the Focus method a handler for the Loaded event and the override to OnNavigatedTo. Nothing works. The GotFocus handler is never called until I actually click somewhere in the view. My clients are not going to accept this. Is this a bug with the Navigation Framework, is there a work around?
Thanks for you help.

Resources