Use of Undefined Constant – assumed id

I am new to angularjs and am having some trouble implementing a simple checklist.

<html lang="en" ng-app>
<body>
<div ng-controller="IdController" class="id-contain">

<ul>
    <li ng-repeat="id in ids">{{ id.body }}</li>
</ul>

</div>
</body>
</html>

and in my main.js I have

function IdController($scope) {
$scope.id = [
    { body: 'some' },
    { body: 'boiler' },
    { body: 'plate' }
];
}

However, when I load the page, i get Use of undefined constant id - assumed 'id' Any ideas on where I could have gone wrong?

Edit: I have adjusted the name in the controller from $scope.id to $scope.ids to no avail and when I change the {{}} to [[]] it loads [[ id.body ]] 3 times, but not the value. When I run it with {{}} it is giving me the same error and is parsed as <?php echo id.body; ?>

Answer

That’s a problem with blade, you can change laravel’s config for blade template token from {{}} to something else like [[]]

Blade::setContentTags('[[', ']]');
Blade::setEscapedContentTags('[[[', ']]]');

Plus, in your angularjs code you should rename $scope.id to $scope.ids in your controller

UPDATE Blade tokens

EDIT OR you can override angular’s tags delimiters

DEMO

HTML:

<div ng-app="main">
        <div ng-controller="IdController" class="id-contain">
        <ul>
                <li ng-repeat="id in ids">[[id.body]]</li>
            </ul>
    </div>
</div>

JS:

angular.module('main', [])
.config(function ($interpolateProvider) {
    $interpolateProvider.startSymbol('[[');
    $interpolateProvider.endSymbol(']]');
})
.controller('IdController', function ($scope) {
    $scope.ids = [
        { body: 'some' },
        { body: 'boiler' },
        { body: 'plate' }
    ];
});

Leave a Reply

Your email address will not be published. Required fields are marked *