I am trying to combine AngularJS and Laravel 3. I want to use a angular controller for each view that needs certain javascript functionality like this:
<div ng-controller="newSnippet" ng-init="init()">
@section('navbar')
{{ data.attribute }}
@endsection
@section('container')
{{ data.attribute }}
@endsection
</div>
@section('scripts')
{{ HTML::script('js/controllers/new-snippet-controller.js') }}
@endsection
</div>
Controller:
app.controller("newSnippet", function($scope, $http){
$scope.init = function() {
console.log('this gets executed');
$scope.data = {attribute: 'Awesome'};
};
});
The problem is that the controller is not inside a section. So it get's rendered in another fashion which causes to render an empty controller div at the top of the document and thus the data.attribute is unreachable.
Does anyone know a solution for this 'scope' problem by combining laravel and angular??
NOTE: I actually modified Angular to use (( )) instead of {{ }} so that's not a problem