ngModelCtrl.$render() is not defined after update from 0.10 to 0.11

[daniel79]

TypeError: undefined is not a function
at Object.fn (http://0.0.0.0:9000/bower_components/angular-bootstrap/ui-bootstrap-tpls.js:2207:19)
at Scope.$digest (http://0.0.0.0:9000/bower_components/angular/angular.js:12251:29)
at Scope.$apply (http://0.0.0.0:9000/bower_components/angular/angular.js:12516:24)
at done (http://0.0.0.0:9000/bower_components/angular/angular.js:8204:45)
at completeRequest (http://0.0.0.0:9000/bower_components/angular/angular.js:8412:7)
at XMLHttpRequest.xhr.onreadystatechange (http://0.0.0.0:9000/bower_components/angular/angular.js:8351:11)

[pkozlowski-opensource]

@daniel79 this is hardly a precise bug report... it is not even clear what is the directive your are talking about nor what is your reproduce scenario... It is very hard to act on such info...

Anyway, looking at line numbers I think that your problem is with the pagination directive that has a breaking change as described in the changelog: https://github.com/angular-ui/bootstrap/blob/master/CHANGELOG.md#breaking-changes

Please provide a minimal reproduce scenario using http://plnkr.co/ if this is not about a breaking change described in the changelog...

[Foxandxss]

@pkozlowski-opensource There is a bug with the new datepicker which wasn't fixed for 0.11 #1913. If @daniel79 is not using ng-model that error will pop-up on his code.

[pkozlowski-opensource]

@Foxandxss ah, I must have gotten line numbers wrong - this is why a reproduce scenario is so important... Looking at the code we should either noop all the methods on the fake ngModelCtrl or require it.

[bekos]

I think @pkozlowski-opensource is right about the error here: https://github.com/angular-ui/bootstrap/blob/gh-pages/ui-bootstrap-tpls-0.11.0.js#L2207

Anyway, this is hardly a bug report and shouldn't bother ourselves. I think we should close this and continue the discussion about the datepicker at #1913.

[daniel79]

Thx guys there was few issues. Most of them fixed by applying breaking-changes.

[joselo]

I had the same issue but I just had to add the ng-model

[OpenSiteMobile]

Noob here. I'm having the same error from scripts downloaded yesterday.

<script type="text/javascript" src="../../mobilesiteos/jquery/v210.min.js"></script>
<script type="text/javascript" src="../../mobilesiteos/jquery/ui/v1104.min.js"></script>
<script type="text/javascript" src="../../mobilesiteos/angular/v130b11.min.js"></script>
<script type="text/javascript" src="../../mobilesiteos/angular/animate/v1219.min.js"></script>
<script type="text/javascript" src="../../mobilesiteos/angular/route/v1219.min.js"></script>
<script type="text/javascript" src="../../mobilesiteos/angular/resource/v1219.min.js"></script>
<script type="text/javascript" src="../../mobilesiteos/angular/bootstrap/v0110_tpls.uc.js"></script>
<script type="text/javascript" src="../../mobilesiteos/angular/toaster/v047.uc.js"></script>
<script type="text/javascript" src="../../mobilesiteos/angular/loading_bar/v030.min.js"></script>

...and the error:

TypeError: Object # has no method '$render'
at Object.fn (http://opensitemobile.io/mobilesiteos/angular/bootstrap/v0110_tpls.uc.js:2207:19)
at g.$digest (http://opensitemobile.io/mobilesiteos/angular/v130b11.min.js:110:136)
at g.$apply (http://opensitemobile.io/mobilesiteos/angular/v130b11.min.js:113:264)
at g (http://opensitemobile.io/mobilesiteos/angular/v130b11.min.js:74:181)
at x (http://opensitemobile.io/mobilesiteos/angular/v130b11.min.js:78:206)
at XMLHttpRequest.v.onreadystatechange (http://opensitemobile.io/mobilesiteos/angular/v130b11.min.js:79:250) v130b11.min.js:94
(anonymous function) v130b11.min.js:94
(anonymous function) v130b11.min.js:69
g.$digest v130b11.min.js:110
g.$apply v130b11.min.js:113
g v130b11.min.js:74
x v130b11.min.js:78
v.onreadystatechange

So at line 2148 of of ui-bootstrap v0.11.0 (with templates) we have this:

.controller('PaginationController', ['$scope', '$attrs', '$parse', function ($scope, $attrs, $parse) {
var self = this,
ngModelCtrl = { $setViewValue: angular.noop }, // nullModelCtrl
setNumPages = $attrs.numPages ? $parse($attrs.numPages).assign : angular.noop;

this.init = function(ngModelCtrl_, config) {
ngModelCtrl = ngModelCtrl_;
this.config = config;

ngModelCtrl.$render = function() {
  self.render();
};

Looks to me like the ngModelCtrl object is getting clobbered, but I don't know much about Angular yet, so I can't give a definitive correction. This however gets rid of the error:

.controller('PaginationController', ['$scope', '$attrs', '$parse', function ($scope, $attrs, $parse) {
var self = this,
ngModelCtrl = { $setViewValue: angular.noop, $render: function() { self.render(); } }, // nullModelCtrl
setNumPages = $attrs.numPages ? $parse($attrs.numPages).assign : angular.noop;

this.init = function(ngModelCtrl_, config) {
ngModelCtrl = ngModelCtrl_;
this.config = config;

// ngModelCtrl.$render = function() {
// self.render();
// };

...and seems to work for my particular application.

[Foxandxss]

@OpenSiteMobile And what's your HTML? Did you use a ng-model on it?

[OpenSiteMobile]

Hi Foxandxss,

I guess. I was just running a demo app I downloaded (https://github.com/tjoudeh/FoursquareAngularJS). I searched for ng-model, and 4 lines came up which all looked similar to this one:

<input type="text" data-ng-model="exploreNearby" class="form-control" placeholder="Explore Places In. e.g. New York" />

I'm new to AngularJS, so I can't tell what is right or wrong. I was just trying the latest version of the AngularJS scripts in place of the ones downloaded, when the error occurred.

[deepsaurabh]

Hi,
I faced the same issue in pagination and it is because ng-model was introduced in ui-bootstrap-tpls-0.11.0.js
Explanation and solution for the same is explained here - (https://stackoverflow.com/questions/23419059/pagination-in-angular-ui-bootstrap-throwing-error-compilenonassign/23419555#23419555)