How to to load twig file in symfony with angular ng include

Question

I'm new to angular please suggest with this . I'm trying to load the template in ng-repeat like this but it show the error

Cross origin requests are only supported for protocol schemes: http, data, chrome, chrome-extension, https, chrome-extension-resource.

This is the code i used for the ng-repeat and include .

<div ng-repeat='item in newItems' 
ng-include="'MyBundle:Default:Content/event.html.twig'"></div>

I don't know symfony, but are you delibaretely trying to use a non HTTP protocol? — Robin-Hoodie, Apr 24 '15 at 05:46

score 2 · Answer 1 · answered Apr 24 '15 at 07:28

You can't simply ng-include a twig file from angular. Angular expects to get an url and will not understand Symfony aliasing that you are using there. Furthermore, it can't process TWIG at all.

If you have to use twig (and can't get away with just basic html and Angular), you'll have to create a controller and a route which will serve HTMLs, simplified example:

# app/config/routing.yml

view_route:
    path: /views/{viewName}
    defaults: { _controller: MyBundle:ViewController:viewAction }




# src/MyBundle/Controller/ViewController.php

<?php

namespace MyBundle\Controller;

class ViewController
{
    public function viewAction($viewName)
    {
        return $this->render('MyBundle:AngularViews:' . $viewName);
    }
}

Then you can do views:

<div ng-repeat='item in newItems' 
     ng-include="'{{ path('view_route', { view: 'Content/event.html.twig' }) }}'"></div>

How to to load twig file in symfony with angular ng include

1 Answers1