使用 angularJS 将值插入 jk-rating-stars 元素

Question

你好，我想知道如何使用 $scope angular js.

将值放入 rating="ctrl.rating"

<jk-rating-stars max-rating="5" rating="ctrl.rating"
    read-only="ctrl.readOnly" on-rating="ctrl.onRating(rating)">
</jk-rating-stars>

谢谢

Answer 1

<div ng-app="myApp" ng-controller="MyCtrl as ctrl">
    <jk-rating-stars max-rating="5" rating="ctrl.rating"
        read-only="ctrl.readOnly" on-rating="ctrl.onRating(rating)">
    </jk-rating-stars>
</div>

angular.module('myApp', ['ngMaterial', 'jkAngularRatingStars'])

.controller('MyCtrl', function() {
    this.rating = 3;
    this.readOnly = false;
    this.onRating = function(rating){
      alert('On Rating: ' + rating);
    };
});

The DEMO

angular.module('myApp', ['ngMaterial', 'jkAngularRatingStars'])

.controller('MyCtrl', function() {
    this.rating = 3;
    this.readOnly = false;
    this.onRating = function(rating){
      console.log('On Rating: ' + rating);
    };
});

<script src="//unpkg.com/angular/angular.js"></script>
<script src="//unpkg.com/angular-animate/angular-animate.js"></script>
<script src="//unpkg.com/angular-aria/angular-aria.js"></script>
<script src="https://unpkg.com/angular-material/angular-material.js"></script>
<link rel="stylesheet" href="https://unpkg.com/angular-material/angular-material.css" />
<link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
<link rel="stylesheet" href="https://unpkg.com/angular-jk-rating-stars/dist/jk-rating-stars.css" />
<script src="https://unpkg.com/angular-jk-rating-stars/dist/jk-rating-stars.js"></script>

  <body ng-app="myApp" ng-controller="MyCtrl as ctrl">
    <jk-rating-stars max-rating="5" rating="ctrl.rating"
        read-only="ctrl.readOnly" on-rating="ctrl.onRating(rating)">
    </jk-rating-stars>
    <br>
    <input type="number" ng-model="ctrl.rating" />
  </body>

使用 angularJS 将值插入 jk-rating-stars 元素

Insert value into jk-rating-stars element using angularJS

javascript

angularjs

angularjs-controller

angular-material

The DEMO