Using ES6 Generator in conjunction with the $http service

I'm exploring the ES6 generator in combination with Angular's $http service on the client side. My goal is to utilize the $http service without relying on callbacks, if achievable. For example:

var gen = function* () {
    var test = yield $http.get('/test/');
    console.log(test);
};

var http = gen();
http.next();
http.next(); // returns undefined

/// or ///

var gen = function* () {
    yield $http.get('/test/');
};
console.log(http.next()); //returns a promise object which won't allow me to use the needed data

The motivation behind my inquiry is to replicate a presentation demonstrated here https://youtu.be/QO07THdLWQo?t=4m58s

I am seeking the most straightforward and uncomplicated approach. Any recommendations?

Answer №1

Another approach could be to encapsulate the generator function within Bluebird's Promise.coroutine method like this:

//ensure that Bluebird source code is incorporated

Promise.coroutine(function* () {
    var gen = yield $http.get('/test/');
    console.log(gen.data);
})();

This technique has proven to be incredibly beneficial in more intricate applications, and I trust that others will also find it advantageous. Despite receiving some negative feedback, I have chosen to leave this question posted. For further insights, you can refer to the following helpful resource: https://gist.github.com/learncodeacademy/bf04432597334190bef4

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

typescript scrolling location

In my Angular UI code, I have a component class that includes the following structure: app.component.html //... <div class="banner"> <p-dialog [(visible)]="displayCOI" styleClass="coiDialog" [contentStyle]=" ...

What is the best way to vertically center an item at the end of a card in Bootstrap 4?

In the process of creating a long bootstrap card containing two rows of information including a title and description, I encountered an alignment issue with the button. The button is intended to be aligned to the right of the card while remaining centered. ...

Creating a pagination feature for an HTML table without using jQuery

Hello, I am relatively new to front-end development and currently undergoing training in a project involving HTML, CSS, and JavaScript. However, I seem to be facing an issue with the Table HTML element. I have created a table structure below: A header ...

Conflicting behavior between jQuery focus and blur functions and retrieving the 'variable' parameter via the $_GET method

There is a simple focus/blur functionality here. The default value shown in the 'Name of Venue' input field changes when the user clicks on it (focus) and then clicks away(blur). If there is no text entered, the default value reappears. Input fi ...

Converting JSON data into an array of JavaScript objects

Here is some of the JSON data I have: [ { "items": [ { "retailername": "Zop Now", "value": 475 }, { "retailername": "Snap Deal", "value": 265 ...

variable within the scope of a function

Currently, I am working on an app where I need to capture a few images using Ionic and Angular. There are 3 buttons, each responsible for capturing a picture. Here is the HTML code snippet: <img ng-src="{{srcImage1 || 'img/default_image.png' ...

Disabling ESLint rule in a React application while using WebStorm

Currently, I am working on a React application in WebStorm using the standard setup for React. I have not configured any specific linting rules before, so all error and warning messages that are popping up are due to some default settings. Whenever I execu ...

Contrasting loading data from an empty state and having no items present

On my web page, I pull items from an API and display them. The API request is made in the created hook. I need to display a [loading] message while waiting for the API response, and a [no items] message if the loading is complete but there are no items ava ...

I am looking to display the results table on the same page after submitting a form to filter content. Can you provide guidance on how to achieve this?

Could someone provide guidance on how to approach the coding aspect of my current issue? I have a search form that includes a select form and a text box. Upon submission, a table is generated with results filtered from the form. Should I utilize a sessio ...

Performing an XMLHttpRequest in the same JSP file using Javascript

I am working on a JSP file that contains three dropdown boxes labeled "countries", "regions", and "cities". My goal is to populate the regions based on the selected country, and the cities based on the selected region. I have managed to achieve this using ...

Trouble with updating scope values in the view within IONIC 1 and AngularJS

I recently implemented a feature to save the two most recent login details. The functionality works correctly, but I'm facing an issue where my view only updates upon refresh even though the scope values are being updated. I've tried using $scop ...

Can one extract request data from an rxjs-timeout-error?

Currently, I am working on enhancing our error handling system, particularly in providing better descriptions of errors in both general and testing environments. My focus is on an Ionic app, but I am facing challenges with the rxjs timeout method. One asp ...

When toggling between light and dark themes using the useMediaQuery hook, the Material-ui styling is being overridden

While working with next.js and material-ui, I encountered an issue where the theme would change based on user preference. However, when switching to light mode, the JSS Styles that I had set were being overwritten. This problem only seemed to occur in ligh ...

Searching through nested JSON data in an Angular application

I have a dynamic menu generated from a JSON object which looks like this: [ { "name":"Menu Item 1", "id":"8", "children":[ { "name":"Sub Menu 1-1", "id":"1", "children":[ ...

I'd like to change the name of the JSON key retrieved from the API request

I have a JSON format stored in my database that looks like this. [ { ip.src:"192.168.200.10", y:1506 }, { ip.src:"192.168.200.10", y:1506 }, { ip.src:"192.168.200.10", y:1506 }, { ip ...

Font size for the PayPal login button

I am looking to adjust the font size of the PayPal Login button in order to make it smaller. However, it appears that the CSS generated by a script at the bottom of the head is overriding my changes. The button itself is created by another script which als ...

Warning: Unhandled promise rejection in MSSQL with NodeJS detected

Currently, I am in the process of experimenting with NodeJS to set up an API. However, whenever SQL encounters an error related to NULL columns, my http call gets stuck, and the error is displayed in the node console. The specific error I encounter is: ...

What role does the cleanData function play in jQuery?

While delving into the inner workings of jQuery, I came across the cleanData function multiple times. It is called by jQuery.remove() and other functions alike. What is the significance of invoking cleanData before removing a DOM element? Is jQuery's ...

Unnecessary Page Diversion

Within my index.php file, I have a download button with the id of "render". Using AJAX, I am sending a request to the server. The JavaScript code being utilized is as follows: $('#render').click(function(e){ $('html,body').animat ...

Chrome on IOS: Experiencing screen freezing while scrolling

1) I'm working with Material UI in React JS. I have added a simple scrollable code, but when I reach the bottom of the screen/scroll, it freezes. 2) I also tried it with a simple HTML page and it worked correctly. <div style={{ ...