How to use Angular UI Bootstrap with Laravel 5

Question

I am using Angular UI Bootstrap with my Laravel Framework 5. I am using Rating directive. I see following error :

TypeError: Cannot read property '0' of null
    at Object.ib.functionCall (angular.js:12405)
    at n.$get.n.$digest (angular.js:14300)
    at n.$get.n.$apply (angular.js:14571)
    at eg.$$debounceViewValueCommit (angular.js:23391)
    at eg.$setViewValue (angular.js:23363)
    at HTMLInputElement.l (angular.js:19784)
    at HTMLInputElement.m.event.dispatch (jquery.js:4670)
    at HTMLInputElement.m.event.add.r.handle (jquery.js:4338)(anonymous function) @ angular.js:11655$get @ angular.js:8596$get.n.$digest @ angular.js:14326$get.n.$apply @ angular.js:14571eg.$$debounceViewValueCommit @ angular.js:23391eg.$setViewValue @ angular.js:23363l @ angular.js:19784m.event.dispatch @ jquery.js:4670m.event.add.r.handle @ jquery.js:4338
angular.js:11655 Error: [$compile:tplrt] http://errors.angularjs.org/1.3.15/$compile/tplrt?p0=datepickerPopupWrap&p1=template%2Fdatepicker%2Fpopup.html
    at Error (native)
    at https://ajax.googleapis.com/ajax/libs/angularjs/1.3.15/angular.min.js:6:417
    at https://ajax.googleapis.com/ajax/libs/angularjs/1.3.15/angular.min.js:65:275
    at https://ajax.googleapis.com/ajax/libs/angularjs/1.3.15/angular.min.js:112:113
    at n.$get.n.$eval (https://ajax.googleapis.com/ajax/libs/angularjs/1.3.15/angular.min.js:126:15)
    at n.$get.n.$digest (https://ajax.googleapis.com/ajax/libs/angularjs/1.3.15/angular.min.js:123:106)
    at n.$get.n.$apply (https://ajax.googleapis.com/ajax/libs/angularjs/1.3.15/angular.min.js:126:293)
    at l (https://ajax.googleapis.com/ajax/libs/angularjs/1.3.15/angular.min.js:81:240)
    at M (https://ajax.googleapis.com/ajax/libs/angularjs/1.3.15/angular.min.js:85:342)
    at XMLHttpRequest.F.onload (https://ajax.googleapis.com/ajax/libs/angularjs/1.3.15/angular.min.js:86:367)

I think this error is coming because templates are not loading properly. I have put "template folder" in root. I have also tried to put in "public" folder. But still same problem Actual error from angular site is

Template for directive 'datepickerPopupWrap' must have exactly one root element. template/datepicker/popup.html Please answer i am stuck. Thanks in advance

vikasverma92 · Accepted Answer · 2015-06-16 18:02:01Z

1

If you are using "ui-bootstrap-tpls.min.js", you don't have to include templates folder. Templates are wrtten inline in JS file.

edited Jun 16, 2015 at 18:02

answered Jun 1, 2015 at 17:00

vikasverma92

284 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Bruno Lebtag · Accepted Answer · 2015-06-01 14:00:09Z

0

add Angular UI bootstrap's css files in public/css folder and javascript files in public/js. then in your codebase when you need to load Angular's files type this:

<link href="{{asset('css/your-angular-ui.css')}}" rel="stylesheet">

and

<script type="text/javascript" src="{{asset('js/your-angular-ui.js')}}"></script>

if it's not working then it's not Laravel 5's problem. 100% sure.

answered Jun 1, 2015 at 14:00

Bruno Lebtag

4194 silver badges18 bronze badges

Collectives™ on Stack Overflow

How to use Angular UI Bootstrap with Laravel 5

2 Answers 2

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related