Reputation: 856
I am working on Symfony3 and Angular 1.5.8 integration, the api part is all ready and now I am trying to display the result in partials using angular js which I am not having any success with.
This is my factory which is responsible for fetching data from symfony
jobs.fac.js
(function () {
"use strict";
angular
.module("ngListings")
.factory("jobFactory", function ($http) {
console.log('inside the factory');
function getJobs() {
return $http.get(Routing.generate("get_jobs"));
}
return {
getJobs: getJobs
}
})
})();
This is my controller jobs.ctrl.js
(function () {
"use strict";
angular
.module("ngListings")
.controller("jobsCtrl", function ($scope, $state, $http, jobFactory) {
var vm = this;
$scope.$on
vm.jobs;
jobFactory.getJobs().then(function (jobs) {
vm.jobs = jobs.data;
});
});
})();
this is my main.js
where i am setting up the states and the controllers that are linked with the states
angular
.module("ngListings", ["ui.router"])
.config(function ( $stateProvider) {
$stateProvider
.state('jobs',{
url: '/listings/jobs',
templateURL: '/partials/home.html',
controller: 'jobsCtrl as vm'
})
;
});
Now this is my index where i am adding ui-view
{% extends 'base.html.twig' %}
{% block body %}
<ui-view></ui-view>
{% endblock %}
Now as I mentioned I am using Symfony so I have tried adding the partials inside the web directory and also inside the AppBundle/Resources/views/jobs/template-name
in both cases the partial does not appear and there is no error in console either.
In console I can see the call being made to the URL and data being returned but its not being displayed in browser.
I will really appreciate if someone can tell me what am i missing here?
Note: Symfony and Angular are not setup separated, angular js files are kept in AppBundle and then being dumped in web directory, this is just for symfony users ofcourse any non symfony user who can see what i am doing wrong is also welcome to comment
Upvotes: 0
Views: 146
Reputation: 189
To serve a template through Symfony you need a route/controller to access it via url ("partials/home.html" in your example). Elegant solution is to have one controller which is taking name of the partial as variable, and render that twig file as response. Take a look at this slide http://www.slideshare.net/mladenplavsic/symfony-angularjs-dafed26/19 as example of Template contoller.
With this you could change your templateUrl to something like "/template/home.html" where "home" is "$name" value for Symfony controller.
Upvotes: 1