CODEWITHSUNDEEP
phpangularjslaravel
Mahmood Sanjrani
Mahmood Sanjrani

Reputation: 110

Laravel 5.4 with angular variable error

I'm trying to use Angular 1.6 in Laravel blade it raise exception. I have tried this link to solve and many other answer I have tried but non of these worked for me. here is code

<div class="row" ng-app="CalculatorApp" ng-controller="CalculatorController">
    <p>Profit Before {{ var }} </p>
</div>

here is Js co

angular.module('CalculatorApp', []).controller('CalculatorController', 
 function($scope) {
 $scope.var=0;
    });

here is error/exception 

use of undefined constant var - assumed 'var'

Upvotes: 2

Views: 790

Answers (6)

Mahmood Sanjrani
Mahmood Sanjrani

Reputation: 110

I solved my problem.

1) I changed library.

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.4/angular.min.js"></script>

2) changed code Putted after body start.

    <body>
    var custom = angular.module('CalculatorApp', []);
custom.config(function($interpolateProvider) {
    $interpolateProvider.startSymbol('[[');
    $interpolateProvider.endSymbol(']]');
});
custom.controller('CalculatorController', function($scope) {
    $scope.aa=0;

    });

html .

<div class="row" ng-app="CalculatorApp" ng-controller="CalculatorController">
        [[ aa ]]
     </div>

Thanks to everyone who tried to solve this problem. Thank you so much.

Upvotes: 0

axel.michel
axel.michel

Reputation: 5764

Both Laravel and Angular use the double curly brackets per default, this is causing your error:

in Blade you can mark a complete block as string:

@verbatim
<div class="row" ng-app="CalculatorApp" ng-controller="CalculatorController">
    <p>Profit Before {{ var }} </p>
</div>
@endverbatim

Or your angular: 

var sampleApp = angular.module('sampleApp', [], function($interpolateProvider) {
    $interpolateProvider.startSymbol('<%');
    $interpolateProvider.endSymbol('%>');
});

In this case all your angular template code has to use something like <%var%>

Upvotes: 2

Murwa
Murwa

Reputation: 2278

Use @ to escape blade processsing angular interpolation.

<div class="row" ng-app="CalculatorApp" ng-controller="CalculatorController">
    <p>Profit Before @{{ var }} </p>
</div>

Upvotes: 1

Raja Mohamed
Raja Mohamed

Reputation: 1026

angular.module('CalculatorApp', [$scope]).controller('CalculatorController', function($scope) { $scope.var1=0; });

Check this out.

Upvotes: 0

Niklesh Raut
Niklesh Raut

Reputation: 34914

Laravel is also using same template tags so its check for laravel variable. change for angular like this 

 $interpolateProvider.startSymbol('[{');
 $interpolateProvider.endSymbol('}]');

Upvotes: 0

Raja Mohamed
Raja Mohamed

Reputation: 1026

Var is keyword in JavaScript , I hope rename the variable name enough to fix.

Upvotes: 0

Related Questions