2017-01-18 2 views
0

У меня есть приложение AngularJS, которое является одностраничным приложением. На каждой отдельной странице плата Pinterest которая загружается, это делается с помощью виджета строителя Pinterest в:Pinterest board работает только на странице reload

This can be found here

Это дает мне следующее придерживаться в моем приложении:

<a data-pin-do="embedBoard" data-pin-board-width="400" data-pin-scale-height="240" data-pin-scale-width="80" href="https://www.pinterest.com/pinterest/pinstudio/"></a> 

и:

<script async defer src="//assets.pinterest.com/js/pinit.js"></script> 

Я добавил это, и плата Pinterest загрузилась, однако при переходе на другую страницу панель Pinterest не загружалась без страницы r efresh, я полагал, что это произошло потому, что сценарий не смог восстановить или загрузить определенный элемент на странице, он просто не знал, что он был там.

Так что я использовал следующее внутри моего приложения Угловая Js в контроллере верхнего уровня: (получил это от here)

$scope.loadScript = function(url, type, charset) { 
    if (type===undefined) type = 'text/javascript'; 
    if (url) { 
     var script = document.querySelector("script[src*='"+url+"']"); 
     if (!script) { 
      var heads = document.getElementsByTagName("head"); 
      if (heads && heads.length) { 
       var head = heads[0]; 
       if (head) { 
        script = document.createElement('script'); 
        script.setAttribute('src', url); 
        script.setAttribute('type', type); 
        if (charset) script.setAttribute('charset', charset); 
        head.appendChild(script); 
       } 
      } 
     } 
     return script; 
    } 
}; 

Затем я вставил следующий в мой суб контроллер для загрузки сценария в:

$scope.$parent.loadScript('//assets.pinterest.com/js/pinit.js'); 

Это работает правильно и добавляет мой скрипт на страницу, но опять-таки Pinterest борту обыкновение нагрузки до обновления, я не буду из идей, я не могу показаться, чтобы выяснить, почему скрипт обыкновение загружать элемент до тех пор, страница обновляется.

Любая помощь была бы потрясающей.

+1

Это ** вероятно ** потому что элемент 'embedBoard' отсутствует, когда скрипт загружается. Для создания кнопки «Пинк» в приложении «Угловое» мы использовали «PinUtils.pinAny();« Для платы вы можете попробовать https://github.com/cornflourblue/angular-pinterest – Sangharsh

+0

Пожалуйста, не стесняйтесь публиковать сообщения в качестве ответа, и я могу отметить как правильно :) –

ответ

1

Это вероятно потому что embedBoard элемент отсутствует, когда скрипт загружается.

В подобном контексте, для создания кнопки Pin на угловом приложении, мы использовали PinUtils.pinAny();

Для борта, вы можете попробовать angular-pinterest.