The controller is frequently invoked, but specifically on Chrome for iOS

I am currently utilizing AngularJS to create a web application.

Within my app, I am using $routeProvider for navigation. However, the app is quite complex, making it difficult to pinpoint the exact issue. I am curious if anyone else has encountered a similar problem specifically on Chrome for iOS:

  1. By initializing my MainController, I utilize "alert".
  2. On browsers such as Safari, Firefox, Opera, Chrome Desktop, and Safari on iOS, the alert only pops up once, indicating that my Controller is created just once.
  3. However, when accessing the app on Chrome for iOS, I notice 10 to 20 alerts popping up, suggesting that the Controller is being created multiple times.

My inquiry is:

Has anyone faced a comparable situation with their own apps?

This might be a long shot, but perhaps someone else has had similar experiences and can provide insights into what could be causing this issue.

EDIT: Interestingly, when simulating iOS on Chrome (Desktop), the web app functions correctly. The problem seems specific to Chrome on iPads and iPhones.

App.config(function($routeProvider) {
$routeProvider
  .when(APP_CONFIG.init_url, {
    templateUrl: "views/site.html",
    controller: "InitCtrl"
  })
  .when(APP_CONFIG.main_url, {
    templateUrl: "views/site_2.html",
    controller: "MainCtrl"
  })
  .when(APP_CONFIG.another_url, {
    templateUrl: "views/site_3.html",
    controller: "AnotherCtrl"
  })
  .when(APP_CONFIG.andanother_url, {
    templateUrl: "views/site_4.html",
    controller: "AndAnotherCtrl"
  })
  .when("/thanks", {
    templateUrl: "views/site_5.html"
  })

  .otherwise({
    templateUrl: "404.html",
    controller: "NotFoundCtrl"
  });
  });

Answer №1

To those who come across this in the future:

An issue with Chrome (specifically on iOS) was found related to this particular function:

 $scope.$on('$routeChangeSuccess', function() {
  $location.hash(top_of_screen)
  $anchorScroll();
});

By removing $location.hash(top_of_screen), Chrome on iOS now functions as expected.

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

"Learn how to showcase a picture in full-screen mode when the webpage is opened

I recently came across a script on Stack Overflow that allows me to select an image at random from an array. The script can be found here: Script to display an image selected at random from an array on page load However, I want to take this concept furthe ...

Transferring Information from Vue to PHP: What You Need to Know

I need assistance with passing data from Vue to PHP. Currently, I receive a JSON object through a PHP query that looks like this: <?php echo getBhQuery('search','JobOrder','isOpen:true','id,title,categories,dateAdded, ...

What is the method for obtaining the current date when altering the system date to a previous time?

To ensure that my datepicker always displays the current date and does not allow selection of past dates, I need to update the date if the system date is in the past. If I change the system date to a past date, I don't want the datepicker to reflect t ...

unable to retrieve data from MongoDB using db.find

I am currently working with a script that I run through the mongo shell. The first query for posts works perfectly and I am able to receive the data object without any issues. Even when I print the date after running it through the convertDate function, ...

Error encountered: Unable to invoke module in AngularJS using Karma and Jasmine

Trying to implement unit testing for my AngularJS app using Karma, but encountering an issue with the module function. Error message: First Test encountered a declaration exception FAILED TypeError: Property 'module' of object [object Objec ...

How can HTML text be displayed based on certain JavaScript conditions?

By modifying the style of the text, I was able to implement basic functionality for validating correct answers. However, my main query is whether it is feasible to display a specific phrase upon achieving a perfect score. Upon analyzing the provided sample ...

Integrating the HTML form with the CRUD functionalities

After building a backend application with JavaScript, NodeJS, ExpressJS, and MongoDB that utilizes basic CRUD operations, I am now unsure of how to direct the form submissions to the database. Additionally, I am curious about how to allow users to access ...

Deactivate any days occurring prior to or following the specified dates

I need assistance restricting the user to choose dates within a specific range using react day picker. Dates outside this range should be disabled to prevent selection. Below is my DateRange component that receives date values as strings like 2022-07-15 th ...

Preserving DOM object reference in ASP.Net Ajax PageMethod

When invoking an ASP.Net PageMethod, the call is made like this: function doSomething(htmlElement) { PageMethods.GetText(onSuccess, onFailure); } Is there a recommended approach to keep a reference to the htmlElement in the scenario above, allow ...

Setting up 'ngProgress' as a loader in my project using the 'ngbp boilerplate' is straightforward and easily customizable

Currently, I am utilizing the 'ngbp' angular boilerplate from GitHub to develop my project. My goal is to implement ngProgress for displaying a loader when navigating between sections. I have successfully installed ngProgress via bower and ensur ...

Is there a way to construct a Javascript function, without relying on JQuery, for fetching JSON objects from varying

I have been searching for a non-JQuery AJAX function that can fetch data from a URL and return it as a JSON object. For example, let's say I want to display information about Users from one JSON located at URL1 and also include information about Post ...

What is the best way to move data from one HTML link to another HTML link using AngularJS?

<tr ng-repeat="greeting in posts"> <!--<td>{{greeting.user}}</td>--> <td> <div ng-controller="MyCtrl"> <a href="quizlist.js">{{greeting.page_name}} </a> </div> & ...

Encountering issues with compiling files in react app using webpack, failing to compile as anticipated

When it comes to compiling, I prefer using webpack with TypeScript files. In my webpack.config.js file: module.exports = async (env, options) => { const dev = options.mode === "development"; const config = { //Webpack configuration pr ...

Using TouchXML on iOS to parse documents that contain angle brackets

My current task involves parsing an XML document using TouchXML for iOS. Usually, this process runs smoothly but I have encountered a challenge when the document contains angle brackets within the data itself. Here is an example: <reference> <tit ...

When attempting to perform a second addition operation on the Angular calculator, it fails to work. However, each addition works perfectly when done individually

I have encountered a curious issue with my Angular calculators. Individually, they both function perfectly as intended. However, when I attempt to combine them, one always malfunctions. Is there something crucial that I am overlooking in this scenario? (D ...

What sets Babel and TypeScript apart from each other in terms of functionality and features?

While TypeScript was utilized to create Angular2, Babel also appears quite similar. Many established companies prefer Babel over TypeScript. Here are some questions to consider: What specific advantages does each one offer? Which is a better or worse ch ...

Connected with the functionalities of Umbraco Forms

Looking to develop a plugin similar to Umbraco Forms with identical functionality. Is it possible to incorporate custom fields from a database into the Umbraco backend's custom section and have them displayed on the frontend like Umbraco Forms? Seekin ...

Make sure to place the <i> tag within the <li> tag at the bottom to automatically resize the height

Currently, I am working on customizing my menu design with a mix of bootstrap and font awesome CSS styles. It would be easier to demonstrate the issue on a live page. My main objectives are two-fold: I want to position the chevron icon at the bottom with ...

Refrain from revealing AngularJS code before activating it

My AngularJS code displays every time I reload the page https://i.sstatic.net/bzYrr.png Issue: The code appears even when my internet connection is slow or the page does not fully reload. I only want it to display the result. I would appreciate any sugg ...

Fill the next Thursday with JavaScript

I'm having trouble updating the date for the upcoming Thursday using JavaScript. The current script works fine until the end of the month, but if it's the 25th of August, the output will be "Next Thursday - 8/32/2022". I need a more intelligent s ...