How can I use partial laravel view on angular js in url template

I want to show the crawler blade view file in angular JS directive

var commentsApp = angular.module('CommentApp',[]);

commentsApp.directive('commentForm',function(){
    return {
        restrict: 'EA',
        replace: 'true'
        templateURL: 'views/comments/comment-form.blade.php'
    }
});

I want to use it with angular directive instead @include('comments.comment-form') Where is my problem? How to solve it. Thank.

+4
source share
2 answers

You must first determine the route in laravel

Route::get('comment-form', function() {
    return view('comments.comment-form');
});

Then you can use it in AngularJS

var commentsApp = angular.module('CommentApp', []);

commentsApp.directive('commentForm', function() {
    return {
        restrict: 'EA',
        replace: 'true',
        templateURL: 'comment-form'
    }
});
+11
source

The answer above is a good idea, however I don't like the idea of ​​asking for a routing pattern. We will create a route for each component: c. I leave my solution here:

  • In gulpfile.js inside the elixir function, add this line:
 


     var elixir = require('laravel-elixir');
        elixir(function(mix) {
            mix.copy('resources/assets/js/angular/components/**/*.template.html', public/angular-templates'); 
//Find all files with suffix .template.html
    });



, "angular", , "",



    Angular----------------------------- 
    --Components------------------------ 
    ----my-component.directive.js------- 
    ----my-component.template.html------


  1. angular, (www.myapp.com, localhost: 8000 ..), :


    angular.module('myModule',[])
    .value('pathAssets', location.origin + '/angular-templates/')


  1. urll , :


    templateUrl: pathAssets + '../angular-templates/my-template.html', 


, angular , D: , , gulpfile.js



    mix.scripts([
        '../../../bower_components/angular/angular.min.js',
        'angular/app.js',
        'angular/controllers/**/*.controller.js',
        'angular/components/**/*.directive.js',
        'angular/bootstrap.js',
], 'public/js/app.js'); //We concatenate angular files saving them in app.js


  1. , 'gulp' ( ), angular -templates.

:)

0

All Articles