Troubleshooting problems with an Angular controller

I am currently working on developing a basic app that retrieves data from MongoDB. However, I encountered an error in the console:

Uncaught TypeError: Cannot read property 'controller' of undefined at model.js:8


'use strict';

var mid = angular.module('mid', [
  'ngRoute'
]).

mid.controller('pageCtrl', function($scope, $http){ <------- This line
  $scope.pages = [];

  $http({
    method: 'GET',
    url: 'http://127.0.0.1/pages'
  })
    .then(function(pages) {
      $scope.pages = pages.data;
   })
    .catch(function(errRes) {
      // Handle errRess
  });
});

Could someone please help me identify what might be causing this error?

javascriptangularjsmongodb

Answer №1

Make sure to remove the . when declaring the module

var mid = angular.module('mid', [
  'ngRoute'
])

DEMO

'use strict';

var mid = angular.module('mid', [])
mid.controller('pageCtrl', function($scope, $http){ 
      $scope.display = "test";
      
 });
<!DOCTYPE html>
<html ng-app="mid">
<head>
  <script src="https://code.angularjs.org/1.2.1/angular.js"></script>
  <link rel="stylesheet" href="style.css" />
 </head>
<body ng-controller="pageCtrl">
 
{{display}}
</body>
</html>

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

Retrieve the individual character styles within an element using JavaScript

I'm currently dealing with a dynamically created div that features styled characters like: <div>Hello <b>J</b>oe</div> and my goal is to identify which characters are styled (in this case, the letter J). I've already atte ...

javascripthtmlcss

Having trouble getting the Scene to appear in Three.js

I'm encountering some challenges with three.js as a beginner, specifically in rendering my scene and camera. Although I have successfully converted Adobe Illustrator vectors, I am struggling to render the scene properly. Even when removing the scene, ...

javascriptthree.js3ddata-visualization

Node.js UDP broadcast to subnet not working properly in Linux

Here is a simplified Node JavaScript code snippet for testing purposes. Click here to view the code on GitHub This code creates a socket for each interface address, calculates the subnet broadcast address, and then sends data every second for 4 seconds t ...

javascriptnode.jslinuxudpsubnet

Tips for implementing a regular expression in JavaScript to parse tags from a Docker image?

I recently came across this regex for parsing docker image tag in Python. ^(?P<repository>[\w.\-_]+((?::\d+|)(?=/[a-z0-9._-]+/[a-z0-9._-]+))|)(?:/|)(?P<image>[a-z0-9.\-_]+(?:/[a-z0-9.\-_]+|))(:(?P<tag>[\w.&bs ...

javascriptpythonregex

Tips for looping through client.get from the Twitter API with node.js and express

I am in the process of developing an application that can download a specific number of tweets. For this project, I am utilizing node.js and express() within my server.js file. To retrieve data from the Twitter API, I have set up a route app.get('/ap ...

javascriptnode.jsloopsexpresstwitter

Filtering Quantity Based on Specific Attribute in ReactJs

I want to implement a quantity filter that can be based on color, size, or both. For instance, when I select the red color, it should display the total quantity of red items available. However, if I choose both the color red and size small, it should show ...

javascriptarraysreactjsjsonfilter

What are the best practices for storing data in MongoDB?

Can MongoDB store files directly in the database BSON structure by serializing or base64 encoding, instead of using the GridFS filesystem? Any assistance is greatly appreciated. Thank you. ...

phpmongodb

A guide on assigning a value to an array within a formgroup

if (Object.prototype.hasOwnProperty.call(data, 'checklists')) { if (Array.isArray(data.checklists)) { data.checklists.map((dt: any) => { dt.tasks.forEach((task: any) => { const dataArray = new FormGroup({ ...

javascriptangulartypescript

Halt the program's process until the ajax request has finished

Struggling with what seems like a common issue of the "Asynchronous Problem" and finding it difficult to find a solution. Currently, I am working on a custom bootstrap form wizard which functions as tabs/slideshow. Each step in the wizard is represented b ...

javascriptjqueryajax

Enabling Cross-Origin Resource Sharing (CORS) for PUT requests in

When attempting to send a PUT request to my REST API endpoint, I encountered the following error message: Method PUT is not allowed by Access-Control-Allow-Methods in preflight response. I managed to enable CORS for POST requests using the solution provi ...

javascriptnode.jsexpresscors

JQuery enthusiast seeks cheerful clicker for callback upon event binding

Incorporating a complex functionality into a click event is proving to be challenging $(someSelector)).bind('click', someFunction(a,b,c)); function somefunction(a,b,c) { return function() { // dive into complexity $(anotherS ...

javascriptjquery

Decoding an array in JSON format from PHP

Hey there! Currently, I am working with an associative array in my PHP file, which I convert into a JSON object and pass to my JavaScript file. My goal is to loop through this array and identify the item with a matching key. Here's what I have done so ...

javascriptphpjqueryarraysjson

Setting up grunt-contrib-nodeunit to generate JUnit XML output: a step-by-step guide

I have been searching for information on how to configure reporters in the grunt-contrib-nodeunit module, as I recently added this task to my Gruntfile.js. nodeunit: { all: ['nodeunit/**/*.test.js'], } Does anyone know how to instruct Grunt ...

javascriptnode.jsunit-testinggruntjsnodeunit

When using node.js with express, the req.on('end') event is triggered, but the req.on('data') event does not fire

When using body parser, you have the option of either: application/x-www-form-urlencoded body parser or json body parser Both options yield the same results. This is how the API is being called: $.ajax({ type:'post', url:'/ ...

javascriptnode.jsexpress

How can I adjust the size of the renderer in Three.js to fit the screen?

Encountering issues with the code snippet below: //WebGL renderer renderer = new THREE.WebGLRenderer(); renderer.setSize(window.innerWidth, window.innerHeight); //TODO: set optimal size document.body.appendChild(renderer ...

javascripthtmlcssthree.js

Modify the class of an element using a radio button within a modal (Angular UI-Bootstrap: Extracting data from a popup dialog box)

Incorporating a modal dialog and radio buttons to switch the class of an element has posed some challenges for me. I have three classes available - theme-1, theme-2, and theme-3. Using the ng-class directive didn't quite work as expected because each ...

angularjsangularjs-directive

JavaScript Tutorial: Merging Two Arrays while Maintaining Original Index Positions

I have two arrays that I need to merge together. One array contains numbers, while the other array contains the corresponding titles for those numbers. This data was retrieved from a csv file, hence the current structure of the arrays. Array 1: dataResul ...

javascriptarrays

The Flapdoodle Embedded Mongo refuses to initiate

I am currently facing an issue with starting an Embedded Mongo instance during my unit tests. I have included the flapdoodle embedded mongo package in my project dependencies, but encounter an error when trying to run the tests. Here are my build.gradle d ...

javamongodbspring-bootjunit

Choose all elements by their class except for a particular container defined by the parent element's ID

Can you provide an example of translating the function below into utilizing the .not method (or not selector)? $(".CLASS").filter(function(i, e){ return (e.parentNode.id != "ID"); } ...

javascriptjquery

ngAnimateSwap - animations do not function as intended when boolean expressions are utilized

I adapted the original ngAnimateSwap demonstration from the AngularJS documentation to utilize a boolean expression for triggering the slide animation. Initially, I anticipated the banner to switch back and forth between 'true' and 'false&a ...

javascriptangularjsng-animateangularjs-1.5