A ReferenceError was thrown because angular is not defined within the angular-moment.js script

After spending an hour trying to figure out what went wrong, I still can't solve this problem. I've searched on stackoverflow for answers, but nothing seems to be helpful. The issue arises when trying to integrate Moment js into my project.

  1. Checked this link (https://github.com/urish/angular-moment)
  2. Followed all the instructions provided.
  3. Encountered an error: angular is not defined at angular-moment.js:630.

This is the snippet of my code:

index.html

<!-- moment extension -->
    <script src="lib/moment/moment.js"></script>
    <script src="lib/angular-moment/angular-moment.js"></script>

    <!-- ionic/angularjs js -->
    <script src="http://maps.googleapis.com/maps/api/js?libraries=places&amp;sensor=false"></script>
    <script src="lib/ionic/js/ionic.bundle.js"></script>
    <script src="cordova.js"></script>
    <script src="lib/ionic-timepicker/dist/ionic-timepicker.bundle.min.js"></script>
    <script src="lib/ngCordova/dist/ng-cordova.min.js"></script>

Javascript

angular.module('starter.controller', ['ionic', 'ionic-timepicker', 'angularMoment'])
.controller('checkoutOrderCtrl', function ($scope, moment) {
        var NowMoment = moment();
        $rootScope.date = NowMoment.format('YYYY-MM-DD');
        $rootScope.time = NowMoment.format('h:mm:ss');
}

Your assistance will be greatly appreciated.

Answer №1

To ensure proper functionality, it is important to include the angular-moment.js script after the angular.js file:

<script src="angular.min.js"></script>
<!-- moment extension -->
<script src="lib/moment/moment.js"></script>
<script src="lib/angular-moment/angular-moment.js"></script>

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

Transforming JSON data into a dynamic Tableview

I've been experimenting with this issue for quite some time now, but I can't seem to find a solution. My API returns tasks in JSON format. When I print the data using Ti.API.info(this.responseText), it looks like this: [INFO] [{"created_at":"20 ...

What is the best way to enable import and require support for npm modules?

Recently, I successfully published my debut module on npm using Javascript. Now, I am eager to ensure that it can support both import and require functions. Can someone guide me on how to achieve this? For reference, the module in question is available at ...

The initialization of an Angular variable through ng-init will consistently result in it being undefined

Currently, I am in the process of learning AngularJS. As part of my learning journey, I decided to initialize a variable using ng-init. However, I encountered an issue where the variable's value always remained undefined. Below is the snippet of code ...

In Angular, link a freshly loaded ".js" controller to a newly loaded "html" view following the bootstrapping process on ngRoutes

As a newcomer to Angular, I have been experimenting with loading dynamic views using ngRoutes (which is very cool) along with their respective .js controllers for added functionality. However, I am encountering difficulties in binding them together after b ...

Javascript, removeFromString

I'm currently working on a JavaScript function that takes in two strings. The first string is any sentence provided by the user, and the second string consists of letters to be removed from the original sentence. My approach involves converting both s ...

The anchor tag seems to be malfunctioning within the div container

<style type="text/css> .xyz { position: absolute; top: 120px; left: 160px; z-index: -1; } #container { position: relative; overflow: visible; opacity: .3; } </style> <body> <div> <video i ...

Having two custom directives within the same module is causing functionality issues

While working with a module called validationMod for form validation, I encountered an issue with two custom directives. Surprisingly, only the second directive was executing, displaying an alert for test2. However, upon removing the second directive, the ...

Tips for increasing efficiency in Javascript development by leveraging the power of the computer to automate tasks and minimize manual work

When working with JavaScript, what techniques can be used to develop and test efficiently and accurately while focusing on algorithms rather than mechanics? Are there any useful tools that can be utilized in batch or command line mode (outside of an integr ...

In Angular/Typescript, dynamically add a class to a `td` element when it is clicked. Toggle the class on and off

My problem arises when trying to individually control the arrow icons for each column in my COVID-19 data table. By using Angular methods, I aim to show ascending and descending arrows upon sorting but run into the challenge of changing arrows across all c ...

The table is not visible when using Bootstrap Vue

Can anyone help me with displaying a table of flowers? I am having trouble making it show up on my page. Not quite sure how to use my data to get the flowers to display properly. Any guidance or advice would be greatly appreciated. <b-table> ...

What could be causing the malfunction of this ng-show and ng-hide feature?

I need help with my AngularJS app. I am trying to display messages dynamically after making an AJAX request, but for some reason they always stay hidden and I can't seem to figure out why. Here is the HTML code: <div ng-show="message"> < ...

Navigate through set of Mongoose information

I have a challenge where I need to retrieve an array of data from Mongoose, iterate through the array, and add an object to my Three.js scene for each item in the array. However, when I try to render the scene in the browser, I encounter an error that say ...

Ways for enabling the user to choose the layout option

I am looking to develop a customized reporting system where users can select the specific fields they want to include in the report as well as arrange the layout of these fields. The data for the reports is sourced from a CSV file with numerous columns. Us ...

Unable to access child props in parent event handler in React

Currently utilizing React for building a UI, the structure involves a parent component and a child component as shown below: // Child Component var ListItem = React.createClass({ render: function() { var link_details = ( <div> ...

Executing a function upon loading a page triggered by a submitted form

Recently on my index.php page, I implemented a form that posts data into a third-party newsletter system. After the form submission, the page reloads to index.php?mail&. Is there a way to detect when the page is loaded and determine if the form has bee ...

Utilize the map function to extract retrieved information

I am currently working on fetching data from the newsapi website. The data is returned in an array-like object format. https://i.sstatic.net/k9YiC.png My main objective now is to iterate through this data and display it using my NewsItem component. Below ...

Guide on merging two objects in AngularJS

Is there a way to combine two requests in angularJS for employee and Allowance info using the empID as the link between them, as shown in Level 3? Level 1 : Employee Information [ { "empID": "PC145", "fullName": "Lamin L Janneh", "Job": ...

Ways to avoid scrolling on a fixed element

Here is the HTML setup I have... body .top .content The issue I am facing is that when scrolling reaches the end of the ul in the .top element, the background starts to scroll. This can be quite disorienting and makes the site slow on tablets. Even ...

Creating an event emitter instance

I'm intrigued by the process of objects transitioning into event emitters. The documentation showcases code that resembles the following: var EventEmitter = require('events').EventEmitter; function Job(){ EventEmitter.call(this); } I fi ...

Guide to positioning a div in the center while implementing animations through transition and transformation using scale

Creating a popup for my React app without relying on external libraries is my current project. I am experimenting with using transition and transform with scale to size the popup dynamically based on screen size and content, then center it on the screen. ...