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.

javascriptangularjsregexsafari

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

Configuring Nginx for hosting an Angular application with a Node.js API

I have built an API using Express and a front-end using Angular. Both are located in different directories named /var/www/apps/client and /var/www/apps/server. Now, I am trying to deploy my application using Nginx as a web server. While I can successfully ...

angularjsnode.jsexpressnginx

What is the best way to invoke an API two times, passing different parameters each time, and then merge both responses into a single JSON object using a callback function?

This code snippet is currently functional, but it only retrieves the JSON response for the first set of parameters. I am looking to make multiple calls to an external API with different parameters and then combine all the responses into one concatenated J ...

javascriptjsonapipromiseasynccallback

Can anyone share best practices for writing unit tests for $scope.broadcast and $scope.$on in Jasmine?

Greetings, I am new to the AngularJs/NodeJs realm, so please bear with me if this question seems basic to some. Essentially, I have two controllers where the first controller broadcasts an 'Id' and the second controller retrieves that Id using $ ...

javascriptnode.jsangularjskarma-jasmine

Struggling to retrieve form data in Node.js, Express, and MongoDB?

How can I properly access the data submitted through a form using Node and Express, in order to store it in MongoDB? When I try to retrieve the NAME field, I get "undefined", and for DATA I get "[object Object]". In my MongoDB database, the _id is genera ...

node.jsangularjsmongodbformsexpress

Tips for implementing a ternary operator within a component using the v-for directive

Here is the updated code with a conditional check for item.image: <template lang="pug"> b-carousel.d-none.d-sm-block( id='categoryRoulette' controls no-animation :interval='0' ) b-carousel-slide( v-for=&quo ...

javascriptvue.jsconditional-operator

Ways to address a buffered data problem in Websocket Rxjs. When trying to send a message, it is not being received by the server and instead is being stored in a

Currently, I am utilizing Websocket Rxjs within my application. The connection is successfully established with the server, and upon subscribing to it, all data is received in an array format. However, when attempting to send data back to the server, it se ...

javascriptangulartypescriptrxjsobservable

Managing global HTTP response errors on Vue/axios using Vuex

I've encountered an issue in my VueJS SPA where a strange limbo state occurs. The application fails to recognize that the JWT token has expired, leading it to still display as if the user is logged in. This typically happens after periods of hibernati ...

javascriptvue.jsvuejs2axiosvuex

I would like to check if a given username and password exist in my JSON data

Trying different methods but not achieving the desired outcome. I have limited knowledge about JSON, gathered some information from online sources. var loginDataList = [{ "username": "abc", "password": "abc123" }, { "username": "richa", "p ...

javascriptjqueryjson

Node.js process.exec() function allows you to asynchronously spawn a subprocess

After writing the code, I ran it and found that the terminal was unresponsive with no output, causing the program to be stuck. var util=require('util') var exec=require('child_process').exec; exec('iostat 5',function(err,stdo ...

javascriptnode.js

Can an unresolved promise lead to memory leaks?

I have a Promise. Initially, I created it to potentially cancel an AJAX request. However, as it turns out, the cancellation was not needed and the AJAX request completed successfully without resolving the Promise. A simplified code snippet: var defer = $ ...

javascriptangularjsmemory-leakspromiseangular-promise

Incorporating JavaScript Object-Oriented Programming in PHP

As someone new to JS programming, I am tasked with developing a php web application that relies on ajax calls for all actions without reloading the page. While I have completed the php and JS code, I am struggling to understand what JS OOP entails. My coun ...

javascriptphpjqueryajax

exploring XML documents

With around 250,000 XML files, each named with a UUID, I am looking for the most effective way to perform a full text search on these files and identify the UUID of the matching ones. What would be the optimal approach for indexing them in a nodejs environ ...

javascriptnode.jsxml

Angular implementation of a dynamic vertical full page slider similar to the one seen on www.tumblr

I'm determined to add a full-page slider to the homepage of my Angular 1.x app After testing multiple libraries, I haven't had much luck. The instructions seem incomplete and there are some bugs present. These are the libraries I've experi ...

javascripthtmlcssangularjsfullpage.js

Tips for displaying XML content within an AngularJS application using HTML

I have a string containing data: var xml = "<rss version='2.0'><channel><title>RSS Title</title></channel> </rss>" ; My goal is to display this string on a web page in the proper XML format. <channel& ...

htmlxmlangularjsuser-interface

Restrict the Angular ng-repeat directive to specific rows only

Suppose we have a JSON dataset listing all languages of books: $scope.data = [{ "title": "Alice in wonderland", "author": "Lewis Carroll", "lang": ["en"] }, { "title": "Journey to the West", "author": "Wu Cheng'en", "lang": [" ...

javascriptangularjsangularjs-ng-repeat

Enhancing Page Content Dynamism: Making Elements Static

I have a div element that I want to align on the right side of the screen, but the problem is that it doesn't adjust its position as the content dynamically expands and exceeds the width of the page. Despite conducting extensive research, I haven&apos ...

javascriptjqueryhtmlcss

Using ES6 classes in Express routes: It is not possible to create the property 'next' on the string '/'

I'm currently working on integrating routes using classes in my express js application controller class User { constructor (){ this.username = 'me'; } getUsername(req,res){ res.json({ 'name& ...

javascriptnode.jsexpressecmascript-6

What is the best way to update a local variable in JavaScript using Ajax requests?

function validate_authentication(){ var is_authenticated = false; $.ajax({ type: "POST", url: "/account/islogin/", data: "", async: "false", success: function(data) { if (data == "null") { ...

javascriptajax

Having trouble importing font-face in scss

Currently, I am working on incorporating a Google font into my project. This is the desired outcome: However, the actual result is different: The code snippet in App.vue looks like this: <template> <div id="app">Luckiest Guy</ ...

javascriptcssvue.jssassfonts

What are the reasons behind memory leaks and decreased rendering speed when I exit and then reopen a React component (specifically Material-Table)?

I have been working on a basic React example for learning purposes, and I incorporated the use of material-table in one of my components. However, I noticed that each time I change pages and reopen the component (unmount and mount), the rendering speed of ...

javascriptreactjstypescriptrendermaterial-table