Angular 2 und Laravel 5.2 - Verschiedene Blade Templates anzeigen

Ich habe es gerade geschafft, Laravel und AngularJS 2 zusammen zu bauen. Allerdings ein sehr einfaches Setup, dh ich habe eine Main welcome.blade.php Datei, die als Indexseite angezeigt wird aber ich würde gerne eine Art von Navigation, wo Sie zwischen den Seiten wechseln können und eckig wird die Informationen aus verschiedenen Blade-Vorlagen zu ziehen und das ist, wo ich stecken bin, verstehe ich, wie das Nav in eckigen usw. zu generieren, aber ich bin Ich bin mir nicht sicher, was ich dem Feld @component ({template: xxxxxxxxxx}) hinzufügen soll, damit es Blade-Templates einlesen kann. Hat jemand Beispiele dafür, wie man diese externen Templates in die eckigen Komponenten rendert? Unten ist was ich bisher habe und es injiziert My First Angular 2 App in die Standard Laravel Welcome Seite.Angular 2 und Laravel 5.2 - Verschiedene Blade Templates anzeigen

app.components.ts

///<reference path="../../../public/js/angular2/core.d.ts"/> 
import {Component} from 'angular2/core'; 
@Component({ 
     selector: 'my-app', 
     template: '<h1>My First Angular 2 App</h1>' 
}) 
export class AppComponent { }

boot.ts

///<reference path="../../../public/js/angular2/typings/browser.d.ts"/> 
/* the above file fixes an issue with promises etc - was getting loads of errors then found this http://stackoverflow.com/questions/35382157/typescript-build-getting-errors-from-node-modules-folder*/ 

import {bootstrap} from 'angular2/platform/browser' 
import {AppComponent} from './app.component' 

bootstrap(AppComponent);

welcome.blade.php

<!DOCTYPE html> 
<html> 
    <head> 
     <title>Laravel</title> 
     <script src="{{ url('/') }}/js/es6-shim/es6-shim.min.js"></script> 
     <script src="{{ url('/') }}/js/systemjs/dist/system-polyfills.js"></script> 
     <script src="{{ url('/') }}/js/angular2/es6/dev/src/testing/shims_for_IE.js"></script> 

     <script src="{{ url('/') }}/js/angular2/bundles/angular2-polyfills.js"></script> 
      <script src="{{ url('/') }}/js/systemjs/dist/system.src.js"></script> 
      <script src="{{ url('/') }}/js/rxjs/bundles/Rx.js"></script> 
      <script src="{{ url('/') }}/js/angular2/bundles/angular2.dev.js"></script> 



     <script type="text/javascript"> 

      System.config({ 
       "baseURL": '/js', 
       "defaultJSExtensions": true, 
       "packages": { 
       typescript: { 
        format: 'register', 
        defaultExtension: 'js' 
       } 
       } 
      }); 

      System.import('typescript/boot').then(null, console.error.bind(console)); 
      </script> 
      </head> 
      <body> 
       <div class="container"> 
        <div class="content"> 
         <div class="title">Laravel 5</div> 
         <my-app>Loading...</my-app> 
        </div> 
       </div> 
      </body> 
     </html>

Quelle

2016-04-26 Anonymous

Vielleicht I Ich täusche mich sehr, aber von dem, was ich verstehe, kann Angular keine Blattschablonen darstellen? Sie werden zuerst von Laravel gerendert, bevor sie als normales HTML mit dem Inhalt der Vorlage gesendet werden. Dann wird Angular initialisiert und arbeitet mit dem HTML-Dokument. Normalerweise lasse ich Angular mein gesamtes Routing behandeln und mache es zu einem SPA, indem ich einfach alle undefinierten Routen in routes.php auf eine einzige Indexseite umleite, auf der der Router von Angular verschiedene Ansichten rendert. Leider habe ich den Übergang noch nicht zu Angular 2 geschafft, daher bin ich mir nicht sicher, wie der Router eingerichtet ist. Aber das ist nur eine Routendatei, die ich benutze, die sozusagen einen "Catch-All" hat, der auf die Indexseite umleitet.

Route::group(["prefix" => "api"], function() { 
Route::resource("users", "UsersController"); 
Route::group(["prefix" => "users"], function() { 
    Route::get("{id}/places", "[email protected]"); 
    Route::get("{id}/searches", "[email protected]"); 
}); 
Route::resource("places", "PlacesController"); 
Route::resource("searches", "SearchesController"); 
Route::group(["prefix" => "auth"], function() { 
    Route::get("/", "[email protected]"); 
    Route::get("logout", 'Auth\[email protected]'); 
    }); 
}); 

Route::get('/', '[email protected]'); 

// Authentication Routes... 
Route::get('login', '[email protected]'); // Override, let Angular handle login form 
Route::post('login', 'Auth\[email protected]'); 
Route::get('logout', 'Auth\[email protected]'); 

// Registration Routes... 
Route::get('register', '[email protected]'); 
Route::post('register', 'Auth\[email protected]'); 

// Password Reset Routes... 
Route::get('password/reset/{token?}', 'Auth\[email protected]'); 
Route::post('password/email', 'Auth\[email protected]'); 
Route::post('password/reset', 'Auth\[email protected]');

Quelle

2016-04-26 23:44:59 Jordan

Dank Jordan, die Laravel Routing ist es kein Problem, versuchen sollte, alle Unterlagen zu finden, wie es mit Winkel 2, das ist das Problem zu dienen, kann ich nicht scheinen, nichts zu finden. Angular 1 hat nicht gut mit mir gesessen, also habe ich mich nie wirklich damit beschäftigt, aber Angular 2 macht zumindest aus Sicht der Syntax mehr Sinn, also versuche ich meinen Kopf herumzukriegen und irgendwie mit Laravel-Routing zu arbeiten. –

Angular 2 und Laravel 5.2 - Verschiedene Blade Templates anzeigen

Antwort

Verwandte Themen