2017-02-15 15 views
-1

Так что это монстр функции, которая будет реорганизована, но пока я просто пытаюсь заставить ее работать.Google maps javascript: если Array [i] не определен, игнорируйте строку, которая ссылается на него в infowindow.setContent

Проблема заключается в том, что открытие символа infowindow не выполняется, когда оно содержит неопределенную переменную google places. Я хотел бы иметь возможность игнорировать строку в infowindow.setContent, которая ссылается на неопределенную переменную, чтобы открыть окно infowindow независимо от того, какая информация о месте google доступна. Я мог проверять каждый отдельно, но надеялся, что кто-то найдет более красноречивое решение.

Мой код:

//passed a google place object 
function formatInfoWindow(place) { 

     var name = place.name, 
       open = place.opening_hours.open_now, 
       address = place.vicinity, 
       phoneI = place.international_phone_number, 
       phone = place.formatted_phone_number 
       rating = place.rating, 
       reviewAuth = place.reviews[0].author_name, 
       reviewText = place.reviews[0].text, 
       reviewRate = place.reviews[0].rating, 
       website = place.website, 
       img = place.photos[0], 
       photo = img.getUrl(), 
       info = this.info; 


//creates an array of all the place variables 
     var infoWindowArray = [name, open, address,phoneI, phone, rating, reviewAuth, reviewText, reviewRate, website, img, photo, info]; 


//loop through array to find undefined variables 
     for (var i = 0; i < infoWindowArray.length; i++) { 
      if (typeof infoWindowArray[i] === 'undefined') { 
//somehow ignore those variables in setContent block 
      } 
     } 
     this.infowindow.setContent(
'<div class="infowindow"><strong><h1>' + name + '</h1></strong>' + 
    '<address>' + address + '</address>'+ 
    '<p>Open Now: ' + open + '&nbsp;&nbsp;&nbsp; Rating: ' + rating + '&nbsp;&nbsp;&nbsp; ' + '<a href="' + website + '">Website</a></p>'+ 
    '<p><a href="tel:' + phoneI + '">'+phone+'</a></p>'+ 
    '<h3><b>Notes:</b></h3>'+ 
    '<p>' + info + '</p>'+ 
    '<h4>' + reviewAuth + '&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;Rating: '+reviewRate+'</h4>'+ 
    '<p>' + reviewText + '</p>'+ 
    '<img src='+ photo + ' ></img>'+ 
'</div>' 
     ); 
     this.infowindow.open(map, this); 
    } 

ответ

0

Вы можете сделать это шаблон строки и использовать регулярные выражения, чтобы заменить значения, как показано ниже

function formatInfoWindow(place) { 

    var img = place.photos[0]; 

    var infos = { 
    name: place.name, 
    open: place.opening_hours.open_now, 
    address: place.vicinity, 
    phoneI: place.international_phone_number, 
    phone: place.formatted_phone_number, 
    rating: place.rating, 
    reviewAuth: place.reviews[0].author_name, 
    reviewText: place.reviews[0].text, 
    reviewRate: place.reviews[0].rating, 
    website: place.website, 

    photo: img.getUrl(), 
    info: this.info 
    }; 


    var contentTemplate = '<div class="infowindow"><strong><h1>##name##</h1></strong>' + 
    '<address>##address##</address>' + 
    '<p>Open Now: ##open##&nbsp;&nbsp;&nbsp; Rating: ##rating##&nbsp;&nbsp;&nbsp; ' + '<a href="##website##">Website</a></p>' + 
    '<p><a href="tel:##phoneI##">##phone##</a></p>' + 
    '<h3><b>Notes:</b></h3>' + 
    '<p>##info##</p>' + 
    '<h4>##reviewAuth##&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;Rating: ##reviewRate##</h4>' + 
    '<p>##reviewText##</p>' + 
    '<img src="##photo##"></img>' + 
    '</div>'; 

    var content = contentTemplate.replace(/##(.*?)##/g, function(match, prop) { 
    return infos[prop] || ""; 
    }); 


    this.infowindow.setContent(content); 
    this.infowindow.open(map, this); 
} 

демо здесь: https://jsfiddle.net/4Lxhyqje/

или вы можете используйте шаблонный двигатель, такой как Ручки: http://handlebarsjs.com/

+0

Спасибо! Я пытался работать со строками шаблонов, но решение все более усложнялось, поэтому я его оставил. Это потрясающе. –

+0

вы можете объяснить функцию (match, prop) { return infos [prop] || ""; }); –

+0

Подробнее здесь: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/replace – Diode