angular.js get links from database

Question

I'm using laravel 5 for backend and angular.js for frontend. App is completely driven by ajax requests.

I'm showing some static links(which would be always on any page visible) in my view like this:

<li ng-repeat="link in links">
    {{link.name}}
</li>

1. What's the best way to handle this? My view doesn't contain .blade(because of angular) in name so I'm not able to load these links throw php.
2. Should I try to make some php workaround or load it in angular throw $http ?

3. If in angular how should I get it into this config function?

    app.config(function($routeProvider, $locationProvider) { \n  var links = ??;  // http doesn't want to work here \n  links.map(function(item) { \n    $routeProvider.when('/'+item.url, { \n      .. \n    }); \n  }); \n}); \n

Answer 1

1. I would suggest first to integrate the AngularJS to work together with blade template engine in Laravel. This can be done easy with angular service called interpolation. Here is how you will make it:

    <script> var customInterpolationApp = angular.module('customInterpolationApp', []); customInterpolationApp.config(function($interpolateProvider) { $interpolateProvider.startSymbol('[['); $interpolateProvider.endSymbol(']]'); }); customInterpolationApp.controller('DemoController', function() { this.label = "This binding is brought you by [[ ]] interpolation symbols."; }); </script> <div ng-app="App" ng-controller="DemoController as demo"> [[demo.label]] </div> 

Here is angularjs page explaning the $interpolateProvider

This way you will not have conflict between AngularJS and Blade Template Engine

2. You should load it with AngularJS

3. You should attach the result to a $scope.links in a custom AngularJS controller. Based on the code from step 1 you can inject $http into anonymous DemoController function, and after this inside controller do something like this:

   var self = this; $http.get('YOUR API LINK', function (data) { self.links = data; });