JSFiddle - React, Tailwind, and code Playground

HTML

<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.3.16/angular.js"></script>
<div ng-app='MyModule' ng-controller='DefaultCtrl'>{{ test }}</div>

JavaScript

var myApp = angular.module('MyModule', []);

myApp.controller('DefaultCtrl', function ($log, $scope, $http, myService) {

    var promise = myService.getSuggestions('yahoo');

    promise.then(

    function (payload) {
        $log.info('receiving data jjjjjjjjjj', payload);
        $scope.test = payload;
        $log.info('received data kkkkkkkkkk', payload);
    },

    function (errorPayload) {
        $log.error('failure loading suggestions', errorPayload);
    });
    
});

        
myApp.factory('myService', function ($http, $log, $q) {
    return {
        getSuggestions: function (symbol) {

            var YAHOO = window.YAHOO = {
                Finance: {
                    SymbolSuggest: {}
                }
            };
            YAHOO.Finance.SymbolSuggest.ssCallback = function (data) {
                $log.info("received data ggggggggggg", data);
                deferred.resolve(data);
            }; // YAHOO.Finance     

            var deferred = $q.defer();

            $http.jsonp("http://d.yimg.com/autoc.finance.yahoo.com/autoc", {
                cache: true,
                params: { 
                    callback: "YAHOO.Finance.SymbolSuggest.ssCallback",               
                    query: symbol
                }
            })
            .success(function(data){
                $log.info("received data ggggggggggg", data);
                deferred.resolve(data);
            })
            .error(function(error) {
                $log.error('failure loading suggestions', error);
                deferred.reject(error);
            });

            return deferred.promise;
        }
    }
});