Restangular: Avoiding empty parameter being passed

In my AngularJS application using RestAngular, I have the following controller method:

    $scope.findFriend = function (name, type, limit) {
        return FriendSearch.getList({
            name: name,
            type: type,
            limit: limit
        });
    };

Sometimes, the type parameter may be empty, resulting in an invalid URL generated by Restangular:

http://host:port/rest/friends/search?limit=10&name=Peter&type=

The correct URL should omit the empty type parameter:

http://host:port/rest/friends/search?limit=10&name=Peter

While I can check the parameters before passing them, I'm interested to know if there's a more elegant solution to handle this situation.

Answer №1

Regrettably, I am unable to replicate this issue using Restangular version 1.4. To assist you further, I have created a demo similar to your scenario:

http://plnkr.co/edit/ovwd8wUhBkhPXtBNDfbw?p=preview

Highlighted Section:

  // http://run.plnkr.co/search?name=foo
  $scope.findFriend('foo');
  // http://run.plnkr.co/search?name=foo&type=bar
  $scope.findFriend('foo', 'bar');
  // http://run.plnkr.co/search?limit=3&name=foo
  $scope.findFriend('foo', null, '3');
    // http://run.plnkr.co/search?limit=3&name=foo
  $scope.findFriend('foo', undefined, '3');

Provided that both null and undefined were used as parameters with the expected outcome, it suggests that there may be other factors influencing this behavior.

In cases where empty strings are involved, a simple way to handle them is by checking for '' and replacing it with null.

I have made adjustments to the demo accordingly:

  $scope.findFriend = function (name, type, limit) {
    return FriendSearch.getList({
      name: name === '' ? null : name,
      type: type === '' ? null : type,
      limit: limit === '' ? null : limit
    });
  };
  // http://run.plnkr.co/search?limit=3&name=foo
  $scope.findFriend('foo', '', '3');

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

What is the best way to showcase a QR code on a mesh using three.js?

I utilized the QRcode library available at to try and showcase it on a mesh object as a texture using the following code: var qrcode = new QRCode( "test", { text: "http://jindo.dev.naver.com/collie", width: 128, height: 128, colorDark : " ...

Tips for creating a customizable set of normalization guidelines for an AngularJS and .NET Web Services application

Imagine you have a web application with AngularJS front-end and .NET Web Services back-end. You need to implement a set of normalization rules for form values. For instance, ensuring that an item's name contains only single spaces, replacing "Parkway" ...

Observes the behavior of a React component with the context.router property being undefined

Currently, I am conducting a test on a react component using chai, karma, and enzyme. mount( <Provider store={configureStore(mockContext, null)}> <Component {...props} /> </Provider> ) In the component, I am utilizing context.router.l ...

Discover content within nested arrays - angularJS

I have a function written in angularJS that utilizes find to verify the presence of an item in an array; function checkCartItem(item) { return $scope.cart[0].cart_items.find(function(itm) { return itm.item_id === item.item_id }); } The fu ...

The JSON data lacks compatibility with the usage of track by functionality

I am working on a project that involves three connected select menus. The first one displays series names, the second one displays chapter numbers belonging to the series selected in the first menu, and the third one displays page numbers belonging to t ...

Using Ajax to implement a content slider with lightSlider

Seeking assistance in developing a dynamic content slider utilizing the LightSlider plugin. Currently, I have a script that fetches content from a database table (outputting JSON to HTML) and displays 6 div's of content per slide. However, I aim to di ...

The Bootstrap modal fails to open

I am currently working on implementing a Navbar button that triggers a Bootstrap modal containing a form. While looking for resources, I stumbled upon a useful script at https://gist.github.com/havvg/3226804. I'm in the process of customizing it to su ...

Enhancing the ShaderMaterial attribute in three.js

Exploring the three.js tutorial on shaders, we discover a technique for updating uniform values of a ShaderMaterial: var attributes = { displacement: { type: 'f', // a float value: [] // an empty array } }; var uniforms = { amplitu ...

Unusual actions when making a $.ajax call using the PUT method

When making a call to $.ajax, I use the following code: $.ajax({ type: 'PUT', url: model.url(), data: {task: {assigned_to: selected()}}, contentType: 'application/json' }) The function selected() returns an array. However, th ...

Having trouble finding the element within the form tag even after attempting to use .switchTo().defaultContent()

My HTML is structured like this: <section> <div> <form> <div>Username field</div> <div>Password field</div> <div> <div>.. <div>.. <iframe& ...

Loading an HTML page using jQuery's .load() method that contains embedded JavaScript

I'm facing an issue with loading .html pages (including JavaScript) into a div element. Below is my div setup: <div class="content"></div> This is my php code: <?php if(!$_POST['page']) die("0"); $page = (int)$_POST[&a ...

Retrieve content inside an iframe within the parent container

Hey there! I've been working on adding several iframes to my webpage. Each iframe contains only one value, and I'm trying to retrieve that value from the parent page. Despite exploring various solutions on Stack Overflow, none of them seem to be ...

Using AngularJS to dynamically update the DOM with the response from a service method

Here's the HTML code: <div ng-controller="AutoDeployController as autoDeploy"> <input type="text" ng-model="autoDeploy.message"> <p>Message: {{ autoDeploy.message }}</p> </div> <button ng-click="autoDeploy.chan ...

Can I search Firebase with parameters?

Just started using Firebase and AngularFire. Here's my current data structure: friends -JzKr-mrv-O7rlxrMi3_ creator: "111181498675628551375" description: "dsa" name: "das" --JzKrahnTf47MXp8nAZx creator: "111181498675628551320" ...

Expanding the Element prototype with TypeScript

Is there a corresponding TypeScript code to achieve the same functionality as the provided JavaScript snippet below? I am looking to extend the prototype of the HTML DOM element, but I'm struggling to write TypeScript code that accomplishes this with ...

What is the proper method for implementing a scrollable effect to the <v-bottom-sheet> element within the Vuetify framework?

Within my Vue.js project, I am utilizing the v-bottom-sheet component from Vuetify framework (version 2.1.12). Upon reviewing my code, you can observe that the v-card is enclosed within the v-bottom-sheet. The issue arises with the scrollable parameter of ...

Locate the item within an array that contains the most keys

Can you help me with a coding challenge? I have an array of objects set up like this: let items = [ { a: '', b: 2, c: 3 }, { a: '', b: '', c: 5, d: 10 }, ...

Warning: Attempting to destructure the property 'name' from 'req.body', which is undefined, is causing a TypeError

Currently, I am diving into the world of MERN Stack web development and running into a unique issue. When using Postmate to input data from the body to the database, everything works smoothly when done from the server.js file. However, when attempting the ...

Tips for overcoming a script error within the body of a Next.js project

I encountered an error in my _document.js file when trying to add a script to the body of my document. Here is the specific error message that was returned: https://i.stack.imgur.com/QG5zb.png ./pages/_document.js Error: x Expected '}', got &a ...

Improprove the design of the dropdown component using React

One of the challenges I am facing in my project is using multiple dropdowns from semantic-ui-react. Each dropdown needs to have different props, making the code look like this: <div className="wrapper"> <img className="icon" src={iconA} ...