What are the reasons behind the failure of this regex matching in Angular specifically on Safari browser?

In my angular project, I have the following code. It works perfectly fine in Chrome and Firefox, but in Safari, it throws an exception.

var shour = "9:00:00 PM CDT";
var ehour = "12:00:00 AM CDT";

var conver_shour = shour.match(/^(\d+):(\d+)/)[0] + shour.match(/[AP][M]$/)[0];
var conver_ehour = ehour.match(/^(\d+):(\d+)/)[0] + ehour.match(/[AP][M]$/)[0];

console.log("shour: " + conver_shour); // The expected result is 09:00PM
console.log("ehour: " + conver_ehour); // The expected result is 12:00AM

I attempted to run this on jsbin, plunkr, and jsfiddle, but encountered a failure without being able to determine the cause.

This is the exception: Error: null is not an object (evaluating 'shour.match(/[AP][M]$/)') $eval@https://ajax.googleapis.com/ajax/libs/angularjs/1.5.3/angular.min.js:142:467 $apply@https://ajax.googleapis.com/ajax/libs/angularjs/1.5.3/angular.min.js:143:193 https://cdnjs.cloudflare.com/ajax/libs/angular-ui-calendar/1.0.0/calendar.min.js:1:326 https://ajax.googleapis.com/ajax/libs/angularjs/1.5.3/angular.min.js:156:171

Any assistance would be greatly appreciated. Thank you.

Answer №1

In the given regular expression:

/[AP][M]$/

The intention is to match either AM or PM at the end of a string. However, since those characters are not found at the end, the result of the match function is null. Consequently, trying to access null[0] leads to an exception being thrown.

A correct regex would be:

/[AP]M/

var shour = "9:00:00 PM CDT";
var ehour = "12:00:00 AM CDT";

var conver_shour = shour.match(/^(\d+):(\d+)/)[0] + shour.match(/[AP]M/)[0];
var conver_ehour = ehour.match(/^(\d+):(\d+)/)[0] + ehour.match(/[AP]M/)[0];

console.log("shour: " + conver_shour); // The expected output is 09:00PM
console.log("ehour: " + conver_ehour); // The expected output is 12:00AM

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

In JavaScript, a nameless function is being returned within another nameless function

Can the getNameFun function just return this.name instead of an anonymous function? Is there a reason for this structure? Code Segment 1: var name = "The Window";   var object = {     name : "My Object",     getNameFunc : function(){ ...

Alter the app's entire background color in React.js with a button click

I am facing an issue with changing the background color of my entire React App when a button is clicked. Currently, I am able to change the color of the button itself but not the background. I have imported the App.css file into my project and I am looking ...

Looking for a way to view the files uploaded in a form using ajax?

Currently, I am encountering an issue while attempting to upload a file submitted in a form using PHP. To avoid page reloading, I have incorporated JS, jQuery, and AJAX between HTML and PHP. Unfortunately, I am facing difficulties with the $_FILES variable ...

Is there a way to include e.preventDefault() within an ajax call?

After the user clicks the submit button on my form, the handleSubmit function is triggered. However, I am having trouble calling e.preventDefault() inside my AJAX call due to its asynchronous nature. How can this issue be resolved? class FormRegister ex ...

"Searching for existing data in MongoDB upon click event from the client side: A step-by-step guide

I have developed an express app that allows users to search for movies and add them to lists. If a movie is already added to the list, I want to show 'Already added' instead of 'Added to list'. How can I achieve this functionality from ...

Different option for key press identification

My JavaScript skills are still at a beginner level and I've come across a bug that's causing me trouble. The issue is with keyCode not working on mobile devices (Chrome). It seems that mobile devices do not support keyCode. I think I could use ...

Shifting Angular Component Declarations to a New Location

Here's a question that might sound silly: In my Angular project, I am looking to reorganize my component declarations by moving them from angular.module.ts to modules/modules.modules.ts. The goal is to structure my src/app directory as follows: src ...

Is it possible to utilize the "let" keyword in JavaScript as a way to prevent global-scope variables?

While working on a JavaScript test, I came across an interesting observation related to the let keyword. Take a look at this code snippet: let variable = "I am a variable"; console.log(window.variable); Surprisingly, when I tried to access the variable p ...

Executing a Particular Function in PHP with Arguments

As a newcomer to PHP and JavaScript, I'm attempting to invoke a specific function in a PHP file from JavaScript. Here is my code: <script> function load($dID) { $.ajax({ url: "myPHP.php", ...

Verify the presence of a JSON object within the session storage using JavaScript

I'm currently developing a website where some data is stored within the session. In the initial page, I need to verify if the JSON object already exists in the session. Below is the code snippet that's causing issues: var passedTotal = JSON.par ...

Ways to access a JavaScript object beyond the function scope

Using the code below, I am able to retrieve JSON data when an element is clicked. This data is then used to create a table, fill the cells with images, and append the table to a specific div. function LoadImagesByCategory() { $.getJSON("/Service/GetJs ...

Maintaining TextBox State in ASP.Net Through Postbacks

Can anyone help me figure out how to maintain the control state that has been modified in Javascript? I am working with two TextBoxes, one DropDownList, and a button (all Runat=Server) in C# ASP.net 2010 Express. The first textbox accepts any user in ...

What is the best way to add 1 to a number every second with javascript?

My code seems to be functioning correctly, but I'm having trouble setting the delay and stopping the increment after a certain interval. Can someone please assist me with this? Javascript: $(document).ready(function() { var number = parseInt($(& ...

Is there a way to invert the orientation of an object within a canvas?

As I was experimenting with Javascript, I attempted to implement a feature where my 'Player' character would fall down after reaching a jumpDistance of 50. The idea was to simulate a small jump-like motion for the player. While the code may not ...

transferring information from Node.js/MongoDB to the front-end (invisible in the browser)

I am trying to retrieve data from a mongodb database and pass it to the front-end. The function I have written works in the console, where I can see an array containing elements. However, when I try to view it in the browser, it shows undefined. I am worki ...

Guide on utilizing map function in JavaScript and Vue to generate a fresh array

I am working on implementing a map method in JavaScript and Vue to generate a new array of objects while only including specific items in each object. I have designed a user interface with 2 checkboxes corresponding to 2 distinct objects: <div v-for ...

Using the ES6 object spread operator in the JSX syntax of ReactJS

// modules/NavLink.js import React from 'react' import { Link } from 'react-router' export default React.createClass({ render() { //for example this.props={from: "home", to: "about"} return <Link {...this.props} a ...

What is the best way to display my table?

In the index.php view, you will find my table located <table class="striped"> <thead> <tr> <th>Id</th> <th>Name</th> <th ...

Communicating with my own account through Nodemailer

I have successfully set up nodemailer locally to handle email functionalities on my website. The goal is for it to extract the user's email input from an HTML form and then forward it to my Gmail account through a contact form. <form action="http: ...

In what way is the JavaScript file able to locate the dependencies following the execution of npm install?

Upon receiving a javascript file named "neededjavascriptfile.js" along with a package.json file, I am faced with the task of running it in an html index file while utilizing certain functions from the javascript file. After executing "npm install --omit=d ...