Unlocking the power of Google Feed API to incorporate MIXED FORMAT in AngularJS

Currently, I am utilizing Google's Feed API in conjunction with AngularJS to retrieve my feed data in a mixed format of both JSON and XML. Although I have attempted to modify the method and callback tags to MIXED_FORMAT as per Google's documentation, I have been unsuccessful in making it work. The guide provided by Google demonstrates how to implement this feature, but I am uncertain on how to integrate it into AngularJS. You can find more information on how to use it here: https://developers.google.com/feed/v1/devguide#resultMixed

.factory('FeedLoader', function ($resource) {
    return $resource('http://ajax.googleapis.com/ajax/services/feed/load', {}, {
        fetch: { method: 'JSONP', params: {v: '1.0', callback: 'JSON_CALLBACK'} }
    });
})

Answer №1

To incorporate it into your query, simply add it to the parameters. I adjusted your example to specify the output format as mixed mode.

.factory('FeedLoader', function ($resource) {
    return $resource('http://ajax.googleapis.com/ajax/services/feed/load', {}, {
        fetch: { method: 'JSONP', params: {v: '1.0', callback: 'JSON_CALLBACK', output: 'json_xml'} }
    });
})

Answer №2

I am struggling to extract the image URL from the enclosure tag. Despite following suggestions to use a MIXED OUTPUT with json+xml code, I keep getting an undefined value when attempting to parse the enclosure tag. Referencing this post Google Feed Loader API ignoring XML attributes, I have also tried manually inputting the URL for the MIXED format without success. Below is my complete code. How can I confirm that I am receiving the mixed json output?

var feeds = [];
var entryImageUrl = [];

angular.module('starter.controllers', ['ngResource','ngLocale'])

.factory('FeedLoader', function ($resource) {
        return $resource('http://ajax.googleapis.com/ajax/services/feed/load', {}, {
            fetch: { method: 'JSONP', params: {v: '1.0', callback: 'JSON_CALLBACK', output: 'json_xml'} }
        });
})

.service('FeedList', function ($rootScope, FeedLoader) {
    this.get = function() {
        var feedSources = [
            {title: 'Heraldo De Barbate', url: 'http://www.heraldodebarbate.es/rss/last'},
        ];
        if (feeds.length === 0) {
            for (var i=0; i<feedSources.length; i++) {
                FeedLoader.fetch({q: feedSources[i].url, num: 10}, {}, function (data) {
                    var feed = data.responseData.feed;
                    **var entryImageUrl = feed.xmlNode.getElementsByTagName("enclosure")[i].getAttribute("url");**
                    feeds.push(feed);
                });
            }
        }
        return feeds;
    };
})

.controller('FeedCtrl', function ($scope, FeedList,$timeout) {

  $scope.update = function(){
    $scope.feeds = FeedList.get();
    $scope.$on('FeedList', function (event, data) {
        $scope.feeds = data;
        // $scope.entryImageUrl 
        console.log(feeds);
    });
    $timeout(function() {
      $scope.$broadcast('scroll.refreshComplete');
    }, 500);    
  }
})

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

Having trouble with jQuery focus not functioning properly?

I've been attempting to implement a focus function on a specific input in order to display a div with the class name .search_by_name when focused. However, I'm encountering issues and would appreciate it if someone could review my code to identif ...

Struggling with jQuery fadeIn and fadeOut in IE8?

I am struggling to understand why my fadeIn, fadeOut, and corner() functions are not working in IE8 on my website at . They were functioning properly before, but now they seem to be broken. Can anyone pinpoint the issue causing this problem? If you click ...

What is the best way to merge and nest connected JSON elements?

I am working with two separate JSON files that I need to merge into one single JSON object for use on the frontend of my project. fragments.json [ { "id": 2, "title": "John Smith is nice", "reports& ...

Increasing the Efficiency of Styled Components

It appears to me that there is room for improvement when it comes to checking for props in Styled Components. Consider the following code: ${props => props.white && `color: ${colors.white}`} ${props => props.light && `color: ${c ...

Utilizing AngularJs for searching strings in a function

I'm currently working on implementing a search function using angularjs. However, I have encountered an issue where the function returns results based on my search query but when I delete the search query, it displays all objects in the set. Here&apos ...

Tips for changing input field type from "password" to "text" in Angular?

Is there a way to dynamically convert an input field with type="password" to type="text" in Angular? In my demo, I have two input fields labeled Mobile no and Re-enter mobile number. I want these fields to change to type="text" if the user inputs the same ...

Utilizing Pyspark to efficiently read a JSON data file that contains objects without any separators

I am currently working with a Kinesis Firehose delivery stream that sends data to S3. The issue I am facing is that the JSON objects in the data file are not separated, making it difficult to process them properly. Here's an example of how the data lo ...

Utilizing the Yelp API and/or the Google Places API for project development

Hey there! So I've been given a project for school that involves using either the Google Places API or Yelp API to allow users to search for local restaurants or bars near a specific location. I've spent the last couple of days researching how t ...

Executing one controller function from another controller in Typescript

There are two typescript controllers in my project Controller A { public methodOfA() {//perform some action} } Controller B { public methodOfB() {//perform some action} } I am trying to implement the following functionality Controller B { ...

Troubleshooting Route Rendering Issues with React Router Dom and Loading Components

I am currently developing a React project and focusing on the navbar element. As part of this, I am integrating the react-router-dom into the project. The <Route/> is nested within the <Routes/>, all encapsulated by the <BrowserRouter/>. ...

The URL in a request is altered prior to execution

I am encountering an issue with my NodeJS application where it automatically appends my domain to the URL set in my http request. How can I prevent this from happening? I have tried to search for similar problems but have not found any relevant solutions. ...

Guide to adding a header in Python using urllib2

Trying to access an API from a particular site requires sending a specific header in order to receive the response in JSON format rather than XML. Without including the Accept: application/vnd.travis-ci.2+json header, the default response will be in XML. ...

Tips for managing the background color of a box when the function is constantly refreshing in Internet Explorer

function process(Objects) { var objectId = Objects; displayContent(objectId); } function displayContent(objectId) { var boxId = objectId.id; var color = ret ...

What could be causing the issue with the functionality of third-level nested SortableJS drag-and-drop?

I am currently utilizing SortableJS to develop a drag-and-drop form builder that consists of three types/levels of draggable items: Sections, Questions, and Options. Sections can be dragged and reorganized amongst each other, Questions can be moved within ...

Setting up babel for the pkg CLI/development tool: A step-by-step guide

My current task involves running a system level script within a Linux environment, written in ES6 JavaScript. I am attempting to package it as a binary for deployment using the NPM library called pkg (https://www.npmjs.com/package/pkg). However, I keep enc ...

What is the best approach to transforming my jQuery function into CSS to ensure responsiveness?

I have created a jQuery animation with four functions named ani1(), ani2(), ani3(), and ani4(). Everything is working fine on desktop, but now I am facing the challenge of making it responsive for mobile devices. I am looking for CSS code to replicate the ...

Retrieving the ID and value of a specific dropdown list using jQuery from an array of dropdown lists

My HTML structure looks like this: <?php foreach($active_brand as $brand) { ?> <select name="selector" id="selector"> <?php foreach($options as $option) { ?> <option <?php if($brand['State'] == $option) { ?& ...

Guide on creating uniform heights and widths for images with varying dimensions utilizing CSS (and percentage values)

Is there a way to ensure that all images maintain the same height and width using CSS percentages, rather than set pixel values? I'm working on displaying images in circles, where most are uniform in size but a few outliers distort the shape. The wide ...

Tips for invoking an Android function from an AngularJS directive?

I am facing an issue with my HTML that uses an AngularJS directive. This HTML file is being used in an Android WebView, and I want to be able to call an Android method from this directive (Learn how to call Android method from JS here). Below is the code ...

What is the best way to extract a value from two different HTML identifiers?

Something tells me that this task is quite simple. I just need some guidance on what I might be missing here. All I really want is a basic program that can extract the content from <span id "text"> and paste it into <div id="text2">. funct ...