new Promise(응용)2

new Promise & ajax 사용하기

$(function(){
    var datas;
    // Promise 정의1
    var fileA = function(){
        var promise = new Promise(function(resolve, reject){
            $.ajax('https://firebaseID.firebaseio.com/items/api.json')
            .done(function(response){
                resolve(response);
            }).fail(function(){
                reject('에러 메시지');
            });
        });
        return promise;
    };

    var templates = (datas) => {  
        datas.forEach((data) => {
            var template = '';
            template += '<li class="main__card wow fadeIn">';
            template += '<div class="main__card--bg">';
            template += '<figure>';
            template += '<img class="thumb card__img" src="'+data.img+'" alt="상품이미지" />';
            template += '<figcaption>';
            template += '<h2 class="card__title">'+data.title+'</h2>';
            template += '<p class="card__text">'+data.text+'</p>'; 
            template += '<div class="card__footer">';
            template += '<p class="card__text card__text--secondary">'+data.name+'</p>';
            template += '</div> </figure> <figcaption> </div> </li>';
            $('body').append(template); 
        });
    };


    //위에서 정의한 내용이 Promise 수행이 되고 나서(then) 실행을 한다.
    fileA().then((data) => {
        datas = data;
        templates(datas);    //response 값 출력
    });
});