rating directive from bootstrap-ui module if angular returns an error "Error: $compile:nonassign Non-Assignable Expression"

Question

I'm trying to use the rating directive of bootstrap module for angular but when I click on a star to rate then angular trig this error

enter link description here

I understand that this error is produced because the value that I use in the model it's a constnatn. Let me explain

I have this directive in nrate.html

<rating ng-model="rate" max="5" readonly="false" value="2"></rating>

and this controller

appControllers.controller("singleRatingController", function ($scope, $http) {
    $scope.rate = 0;
});

so I'm using a variable "rate" to load the rate value

In other html page I use the same directive with the same controller and works well

thanks

Answer 1

Use either value or ng-model, not both, depending on which UI Bootstrap version you are using.

JS for both cases:

appControllers.controller("singleRatingController", function ($scope, $http) {
  $scope.rate = 2;
});

HTML - If using 0.11.0:

<rating ng-model="rate" max="5" readonly="false"></rating>

HTML - If using 0.10.0 or below:

<rating value="rate" max="5" readonly="false"></rating>