Widoki AngularJS w Wordpressie

Question

Mam problem z moją funkcją AngularJS w mojej aplikacji Wordpress. Co chcę stworzyć to SPA, aby strona internetowa (nie jest to blog, używam tylko WP jako CMS) działa płynnie i bez ponownego ładowania na telefony komórkowe. Aby osiągnąć ten cel, postanowiłem włączyć AngularJS do WordPressa (jeśli to nie jest najlepsze rozwiązanie, proszę powiedz mi :)). Po tym, jak zrobiłem kilka tutoriali, które wyjaśniły mi temat "widoków" w AJS, próbowałem zrobić to sam w osobnym dokumencie HTML i działało świetnie.

Mój problem został podsumowany, że moje SPA podzielone jest na 3 kolumny. Ten lewy jest dość statyczny (tylko podstawowe informacje), drugi zawsze ma najnowszą zawartość za pośrednictwem WP (która również działa świetnie), a prawa kolumna powinna zmienić jego zawartość, klikając jeden z linków "najnowszej zawartości" . Czy rozumiesz mój pomysł do tutaj? :) Tak więc, jak można się domyślić - tak naprawdę nie chce działać.

<?php get_header();?> <!-- Header + AngularJS included --> 



<div class="content"> <!-- open class="content"--> 
<a href="/?page_id=6"> 

</a> 
<div class="bg-texture"> <!--open class "bg-texture/ closed in "footer"--> 
    <?php while(have_posts()):the_post();?> 
    <div class="col"> 


    <?php if (in_category('infotext')):?> 
    <div class="infotext"> 




    <?php elseif (in_category('apps')):?>     
     <div class="round-borders-panel"> 

    <?php elseif (in_category('righttext')):?> <!-- hier kommen die single-pages rein--> 
      <?php if(function_exists('get_twoclick_buttons')) {get_twoclick_buttons(get_the_ID());}?> 
     <?php endif;?>  


      <h1> 
       <a href="<?php the_permalink()?>"> <?php the_title();?> </a> 
      </h1> 

     <?php the_content(__(''));?> 
     </div> 
    </div> 

       <?php endwhile;?> 

<?php get_the_ID('');?> 


     <script src="angular.min.js"></script> 

     <div data-ng-view></div> 
    <script> 
    var cloud = angular.module("cloud", []); 

    demoApp.config(function ($routeProvider) { 
    $routeProvider 
      .when('/?=p<?php get_the_ID();?>, 
        { 
          controller: 'SimpleController', 
          templateUrl: '<?php get_template_part('single','');?>' 
        }) 
      .when('/view2', 
        { 
          controller: 'SimpleController', 
          templateUrl: 'Partials/view2.html' 
        }) 
      .when('/view3', 
        { 
          controller: 'SimpleController', 
          templateUrl: 'Partials/view3.html' 
        }) 
      .otherwise({redirectTo: '/view1'}); 
    }); 


    </script> 
<!-- Loop--> 

</div> <!-- Close <class="bg-texture--> 

->

To nie będzie działać już teraz, na pewno. Byłbym wdzięczny, jeśli pomożesz mi rozwiązać ten problem. BTW zacząłem programować około 5 tygodni temu - więc mogą być naprawdę głupie miskaty nowicjusza! :)

Pozdrowienia, Yannic :)

Answer 1

myślę kątowa jest tu dość przesadą. Możesz rozważyć użycie jquery (dostarczanego z WordPress). Utwórz łącza w swoich funkcjach jQuery "najnowszej zawartości", które wstawiają żądaną zawartość za pomocą żądania ajax do prawego pola.

WordPress posiada kilka funkcjonalności AJAX zbudowany w: http://codex.wordpress.org/AJAX Może to być najwyższy odsetek dla Ciebie: http://codex.wordpress.org/AJAX_in_Plugins#Ajax_on_the_Viewer-Facing_Side

Podstawowym założeniem jest zarejestrowanie funkcji z do haka z wp_ajax_nopriv_ („żadnych przywilejów”) haka i zwraca się do niego za pomocą czegoś takiego:

jQuery(document).ready(function($) { 
    var data = { 
     action: 'my_action', 
     whatever: 'any value to access later in php' 
    }; 
    jQuery.post(ajax_url, data, function(response) { 
     alert('Got this from the server: ' + response); 
    }); 
}); 

„my_action” powinna być równa ustalonej z rzeczy ty wp_ajax_nopriv_. ajax_url musi wskazywać na admin_url('admin-ajax.php'). Możesz użyć wp_localize_script(), aby było dostępne w twoim js.