Sharing data between Laravel and Angular

When building applications with Laravel and Angular you might come across a problem where you want to print data using AngularJS brackets {{}} but before it can be parsed by AngularJS, Laravel blade engine parses it and tries to replace the value if it finds one. Otherwise Laravel will start complaining about the variables. To solve that you just need to prepend brackets with @ sign so blade engine knows that you just need to ignore this expression and AngularJS will take care of it. And AngularJS will parse it and replace the variables with actual data.

Below is a sample snippet to do this:

@{{ article.body }}

In this snippet Laravel blade engine will ignore this and AngularJS will parse it and replace it with article.body data it has.

Global Variables in AngularJS

I’ve followed the angularjs tutorial and I noticed that I wasn’t able to have global variables.
Turns out to be actually simple but Angular doesn’t mention it.
You will need to edit your app module (app.js )

var app = angular.module('appName',);

//Add this to have access to a global variable

app.run(function ($rootScope) {

    $rootScope.globalVariable = 'Hi, global variabel'; //global variable

});

Now if you want to use it from your controller

function appNameCtrl($scope, $rootScope){

    $rootScope.globalVariable = 'Modji';

}

In your view

My name is {{globalVariable}}

If you are using any services like $http in your controller then you have to pass $rootScope as service along with $http.

app.controller('appNameCtrl', ['$http', '$rootScope', function ($scope, $rootScope){

    $rootScope.globalVariable = 'Modji';

}]);

To see the example visit my Plunker at http://plnkr.co/edit/JyIfkT1AxiCU2xx4WjJK?p=preview

This post is edited and was originally published at Coding Insight.