The error message "TypeError: undefined is not a function when trying to access a resource

I searched online before asking here, but couldn't find a solution.

I'm attempting to call a REST service using ngResource, but my app UI isn't launching due to an error:

05-13 02:16:08.011 2402-2402/com.app.mvalt I/chromium: [INFO:CONSOLE(25642)] "TypeError: undefined is not a function
    at Object.<anonymous> (file:///android_asset/www/js/services.js:8:9)
    at Object.invoke (file:///android_asset/www/lib/ionic/js/ionic.bundle.js:17762:17)
    at Object.enforcedReturnValue [as $get] (file:///android_asset/www/lib/ionic/js/ionic.bundle.js:17615:37)
    at Object.invoke (file:///android_asset/www/lib/ionic/js/ionic.bundle.js:17762:17)
    at file:///android_asset/www/lib/ionic/js/ionic.bundle.js:17580:37
    at getService (file:///android_asset/www/lib/ionic/js/ionic.bundle.js:17721:39)
    at Object.invoke (file:///android_asset/www/lib/ionic/js/ionic.bundle.js:17753:13)
    at extend.instance (file:///android_asset/www/lib/ionic/js/ionic.bundle.js:22311:34)
    at nodeLinkFn (file:///android_asset/www/lib/ionic/js/ionic.bundle.js:21421:36)
    at compositeLinkFn (file:///android_asset/www/lib/ionic/js/ionic.bundle.js:20853:13)", source: file:///android_asset/www/lib/ionic/js/ionic.bundle.js (25642)

Below is my service.js:

angular.module('app.services', ['ngResource'])
    .factory('BlankFactory', [function(){
    }])

.factory('User', [function($resource){
    return $resource('http://1.2.3.4:1234/UASAPI/userRegistration');
    }])

.service('BlankService', [function(){
    }]);

Here is my index.html:

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no, width=device-width">
    <title></title>

    <link href="lib/ionic/css/ionic.css" rel="stylesheet">
    <script src="lib/ionic/js/ionic.bundle.js"></script>
    <script src="lib/ionic/js/angular-resource.min.js"></script>

    <script src="cordova.js"></script>

    <style type="text/css">
      .platform-ios .manual-ios-statusbar-padding{
        padding-top:20px;
      }
      .manual-remove-top-padding{
        padding-top:0px; 
      }
      .manual-remove-top-padding .scroll{
        padding-top:0px !important;
      }
    </style>

    <script src="js/app.js"></script>
    <script src="js/controllers.js"></script>
    <script src="js/routes.js"></script>
    <script src="js/services.js"></script>
    <script src="js/directives.js"></script>

  </head>
  <body ng-app="app" animation="slide-left-right-ios7">
  <div>
    <div>
        <ion-nav-bar class="bar-stable bar-balanced">
            <ion-nav-back-button class="button-icon icon ion-ios-arrow-back"></ion-nav-back-button>
        </ion-nav-bar>
        <ion-nav-view></ion-nav-view>
    </div>
</div>
  </body>
</html>

I downloaded angular-resource.min.js from http://cdnjs.cloudflare.com/ajax/libs/angular.js/1.2.16/angular-resource.min.js

Here is my app.js:

angular.module('app', ['ionic', 'app.controllers', 'app.routes', 'app.services', 'app.directives'])

.run(function($ionicPlatform) {
  $ionicPlatform.ready(function() {
    if (window.cordova && window.cordova.plugins && window.cordova.plugins.Keyboard) {
      cordova.plugins.Keyboard.hideKeyboardAccessoryBar(true);
      cordova.plugins.Keyboard.disableScroll(true);
    }
    if (window.StatusBar) {
      StatusBar.styleDefault();
    }
  });
})

Could someone please help me identify what I'm missing?

Answer №1

Customer service is experiencing issues because the $http object is not being properly injected before its use in the service function.

.service('Customer', ['$http', //<-- $http dependency was missing here.
  function($http){
    return $http.get('http://5.6.7.8:5678/api/customerData');
  }
])

Furthermore, ensure that the versions of AngularJS and ng-http are compatible and do not create conflicts.

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

Is it possible to retrieve data nodes that meet a specific condition using the Firebase JavaScript API in a single trigger? And does it establish a new TCP connection for every query?

Looking for a solution using the Firebase JavaScript API, not the REST method like in this question. My query is a bit different, so I'm hoping for a unique solution. I'm trying to run a query similar to this: "SELECT * FROM db.table WHERE fiel ...

Achieving consistent text alignment in HTML and CSS without relying on tables

As I delve into the world of HTML and CSS, I've taken a traditional approach by crafting a login page complete with three input controls (two text inputs and one button). To ensure proper alignment of these elements, I initially turned to the trusty & ...

Can someone explain the inner workings of the Typescript property decorator?

I was recently exploring Typescript property decorators, and I encountered some unexpected behavior in the following code: function dec(hasRole: boolean) { return function (target: any, propertyName: string) { let val = target[propertyName]; ...

What is the method for initializing fancybox with the precise image index?

My current usage of fancybox involves the following code snippet: $("a[rel=Fancy" + UserId + "].Items").fancybox({ 'autoscale': 'false', 'cyclic': true, 'transitionIn': 'elastic', & ...

React Hooks: Unable to re-enable input after it has been disabled

Attempting to manage the status of my points input whether it's enabled or disabled, I encountered an issue. Upon checking the checkbox, it correctly gets disabled. However, upon unchecking it, the input remains disabled. Initially, I attempted settin ...

"Adding a grid panel to the final node of a tree-grid in extjs: A step-by-step guide

Does anyone have a suggestion on how to add a grid panel to the last node/children of a treepanel dynamically? I would like to append the gridpanel dynamically and for reference, I am providing a link: Jsfiddle I also need to ensure that the gridpanel is ...

The hierarchy of script loading in Angular applications

After years of working with MVC, I recently delved into Angular. Although I am well-versed in JavaScript and HTML, I'm still a beginner in the world of Angular. I spent hours troubleshooting my app only to realize that the problem was elusive. The a ...

One of the great features of Next.js is its ability to easily change

At the moment, my dynamic path is configured to display events by their ID [id].js localhost:3000/event/1 But I would like it to be structured as follows: localhost:3000/city/date/title. All of this information is available in the events database, but I&a ...

Combining Multiple Arrays into One | Node.js

Can someone explain how to merge an array of arrays to me? For instance, I have the following array: [ [ {brand: 'fiat', model: 'palio'} ], [ {brand: 'nissan', model: 'march'} ] ] I want to transform this array int ...

The Zustand store does not reflect changes when the URL is updated

I have a Zustand store connected to the URL. See the code snippet provided below. import { create } from "zustand"; import { persist, StateStorage, createJSONStorage } from "zustand/middleware"; const pathStorage: StateStorage = { ge ...

Accessing website login - <div> and validating user entry

I am currently working on developing a basic login webpage, but I am facing issues with the rendering of the page. Below is the code I am using: function logIn(username, password){ var username = document.getElementById("username").value; var p ...

Get connected to your favorite music on iTunes without the hassle of opening a new window by simply clicking on the

Is there a way to call a link to iTunes (itms://...) without opening a new window? I've tried using window.open but that just opens a new window. Also, $.get('itms://...'); doesn't seem to work for me. Are there any other options avail ...

Creating a variable in Node.js to serve as the name of a nested element within an object

Check out the object I have: obj = { "FirstName": "Fawad", "LastName": "Surosh", "Education": {"University": "ABC", "Year": "2012"} } Take a look at my node.js script: var nodeName = 'Education.Year'; obj.nodeName; // ...

Stopping repetitive ajax requests

When I click the "load more" button quickly, it ends up loading the same content twice. I'm looking for a way to prevent this from happening. Below is the ajax call I use to load more content: <script type="text/javascript"> function loadmor ...

Utilizing JQuery to request a file input and subsequently handle its processing

I am working towards creating a functionality where users can click a button, select a file, and have the program perform actions on that file, such as sending it through an AJAX request for processing. Currently, I have set up a hidden form along with a b ...

Rhino's env.js causes the anchor element's pathname to be undefined

Encountered an issue that appears to be related to how anchor tags are implemented in Rhino. Despite using env.js, there might be a configuration error causing the problem. The issue arises when writing unit tests for code designed for an angularjs applic ...

Leveraging the httponly cookie for transmitting JWT token between a Node REST API and a Vue.js SPA

I am currently in the process of developing a web application that utilizes a Vue.js frontend along with a Node REST API built using express. I am facing a challenge in implementing authentication, particularly in striving for a stateless approach by utili ...

What is the unit testing framework for TypeScript/JavaScript that closely resembles the API of JUnit?

I am in the process of transferring a large number of JUnit tests to test TypeScript code on Node.js. While I understand that annotations are still an experimental feature in TypeScript/JavaScript, my goal is to utilize the familiar @Before, @Test, and @Af ...

Using React.js CSSTransition Component properties with TransitionGroup

Exploring ways to animate a group of divs has led me to discover this example which perfectly fits my needs. However, as I am still new to React, I'm having trouble understanding how the props are passed through the <Fade> component, specificall ...

What could be causing this issue where the call to my controller is not functioning properly?

Today, I am facing a challenge with implementing JavaScript code on my view in MVC4 project. Here is the snippet of code that's causing an issue: jQuery.ajax({ url: "/Object/GetMyObjects/", data: { __RequestVerificationToken: jQuery(" ...