Tips for showing an error message on angularjs(404)

Hey there! Currently, I'm developing an AngularJS application that utilizes a web API as the front end. In instances where a user lacks specific permissions, I handle this by returning an HttpResponseMessage containing a custom error message.

var message = string.Format("You do not have permission");
                        HttpError err = new HttpError(message);
                        return Request.CreateResponse(HttpStatusCode.NotFound, err);

Now, I am looking to display the above message in an alert using AngularJS, and here's what I've attempted so far:

$scope.Update = function () {
        var servCall = ProjectSetting_Service.update(sub);
        servCall.then(function (data) {
            alert(JSON.stringify(data));
            });
    }, function (error) {
//How can I display the error message here?

    }

If anyone could offer some guidance or assistance on how to achieve this, it would be greatly appreciated. Thank you!

Answer №1

To display a specific view in your HTML when an error occurs, follow these steps:

$scope.showError = false;
$scope.Update = function () {
  var servCall = ProjectSetting_Service.update(sub);
  servCall.then(function (data) {
    alert(JSON.stringify(data));
  });
}, function (error) {
  // Display an alert message
  $scope.showError = true;    
}

In your HTML file:

<div ng-show="!showError ">
    <p> Everything is going fine :)</p>    
</div>
<div ng-show="showError ">
    <p> 404 sorry</p>
</div>

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

Zoom in and Zoom out functions in ngPdf with centered view

I have incorporated the pdf canvas to showcase PDFs on my AngularJS/Bootstrap application, and I must say, the preview feature is working exceptionally well. However, one thing that I would like to achieve is centering either my modal or the canvas itself ...

Leverage the power of gRPC with Node.js and TypeScript for seamless

I'm trying to implement GRPC in a Node.js and Typescript project, but I'm facing an issue with generating proto files on Windows 10 using npm. I need to run the file transpile-proto-ts.sh: #!/usr/bin/env bash OUT_DIR="./src" TS_OUT_DIR="./src" ...

The command 'node' is not identified as an internal or external command, executable program, or batch file

While running "npm install node-sass" from git-bash-cli in Windows 10, I encountered a "'node' is not recognized as an internal or external command, operable program or batch file." error. This setup worked fine for years until I upgraded Node t ...

DOJO: Monitoring all global requests for dojo.xhr

Can we monitor dojo.xhrPost requests for activity? I've previously utilized dojo/request/notify to track usage of the dojo/request API, however it does not register requests made with the older dojo.xhr API. ...

Leveraging the power of Google Closure Templates alongside the versatility of

We are embarking on developing an application using JavaScript and HTML5 that will utilize a rest API to access server resources, leveraging the power and convenience of jQuery which our development team is already proficient in. Our goal is to make this a ...

Using the Composition API in Vue 3: Guide to invoking a method within the template to retrieve a return value

Within my template, I have implemented the following code snippet: <template> {{ getScope(scope.row, itemIn.field) }} </template> For the Option API section, I've included: methods: { getScope(data, key) { const str ...

Error Alert: The combination of React and Redux-router is causing an unexpected issue. The reducer is expected to be a

Whenever I make a coding mistake and encounter a runtime error, the error reporting is not very helpful. For example, when I mistakenly typed Date() instead of new Date(), the error message I received was... Uncaught Error: Expected the reducer to be a fu ...

augmentable form that can be expanded flexibly

Perhaps I'm missing something really simple here, but I just can't seem to figure this out. I'm attempting to create a form that can dynamically extend. The issue I'm facing is that I can't get this particular code to function: & ...

What is the best way to add JSON data to a table?

I have developed a php script to create json data. However, I am facing an issue while trying to display this generated json data in a table. While my php code successfully generates the data, it is unable to insert it into the table. I would appreciate an ...

Tips on retrieving objects from Firebase's item Array

Although I've searched for similar questions, I can't seem to find the right solution to my issue. I've been working on a firebase / vue.js project as a training exercise where I'm refactoring it to incorporate Vuex, http vue resource c ...

Synchronous AJAX calls can cause the browser to become unresponsive

I am facing an issue with my jQuery Ajax requests as they need to be synchronous, causing the browser to freeze until a response is received. The main problem I encounter is that I need to display a spinning icon while waiting for the response, but the fre ...

How can I apply angular ng-repeat filter with specific criteria in mind?

I am currently developing an angular application and I need to present customer data in a table using ng-repeat. While I have successfully added ng-filter for searching the results based on user input, I am now looking to incorporate checkboxes to further ...

Trying to find out which div is currently visible on the screen

As part of my project, I am working on implementing a swipe effect that involves moving the upper div based on calculated x and y coordinates. This creates a swipe-like visual effect by adjusting the wrapper's position with the screen width. However, ...

Sending an Ajax request using an array of parameters and then accessing them in PHP

I have created a JavaScript function that facilitates AJAX posts by accepting an array of parameters. The function is outlined below: /** * A quick function to execute an AJAX call with POST method and retrieve data in JSON format * @param {string} url - ...

Steps for disabling a spinner directive in AngularJS for particular $http calls

This specific directive is designed to automatically toggle a loading icon on or off whenever there are $http requests happening. Here's the code snippet: angular.module('directive.loading', []) .directive('loading', [& ...

Can you explain the distinction between using router.METHOD() versus router.route() in Express?

There are two different ways I've come across of writing this code. router.get(path, callback) and router.route(path).get(callback) Based on the surrounding code, they seem to have the same functionality. The documentation for these methods can be ...

Create a dynamic effect by adding space between two texts on the page

const Button = () => { const options = ['test1', 'test2', 'test3']; return ( <div style={{ position: 'absolute', left: '8px', width: 'auto', flexDirection: 'row' ...

JavaScript generated menu control triggers a 'Sys undefined' error in Web Forms

I am currently working on an ASP.NET 4 web application. Upon adding a Menu control to the web form, I noticed that it triggers the generation of the following code just before the closing </form> tag: <script type='text/javascript'> ...

Why is Angular not functioning properly with nested ng-repeats?

I have utilized nested ng-repeat to iterate through all the values of objects. <tr class="" ng-repeat="(position, values) in chartResult.realData track by $index"> <td> <div ng-click="select(position)" ng-class="{selected: ...

Struggling with hashtags and ampersands in Angular when making an HTTP request

Dealing with Special Characters # and & in Angular's http.get() Request URL Take a look at my code first. Angular Service let versionsearch = "&"; let strweeksearch = "%23"; this.http.get(this.apiUrl + 'GetVersionInfo?vehicleVersion=' + v ...