本篇文章主要介绍了Angularjs渲染的 using 指令的星级评分系统示例,小编觉得挺不错的,现在分享给大家,也给大家做个参考。一起跟随小编过来看看吧
本文介绍Angularjs渲染的 using 指令的星级评分系统示例,分享给大家,具体如下:
我试图创建静态使用 angularjs/离子成效甚微的星级评分系统。但目前什么都不输出到屏幕上……我是我做错了吗?
service.html
<h2>{{business.name}}</h2> {{business.distance}} miles <br><div></div><i class="icon ion-chevron-right icon-accessory"></i>
directives.js
angular.module('starter.directives', []) .directive('starRating', function() { return { restrict: 'A', template: '<ul class="rating">' + '<li>' + '\u2605' + '</li>' + '</ul>', scope: { ratingValue: '=', max: '=' }, link: function(scope, elem, attrs) { scope.stars = []; for (var i = 0; i <scope.max; i++) { scope.stars.push({ filled: i <scope.rating }); } } } });
services.js
.service("BusinessData", [function () { var businessData = [ { id: 1, serviceId: 1, name: 'World Center Garage', distance: 0.1, rating: 4 } ]; return { getAllBusinesses: function () { return businessData; }, g<b style="color:transparent">来源gao@dai!ma.com搞$代^码网</b>etSelectedBusiness: function(serviceId) { var businessList = []; serviceId = parseInt(serviceId); for(i=0;i<businessData.length;i++) { if(businessData[i].serviceId === serviceId) { businessList.push(businessData[i]); } } return businessList; } } }])
controller.js
.controller('ServiceCtrl', function($scope, ServicesData, BusinessData, $stateParams) { $scope.service = ServicesData.getSelectedService($stateParams.service); $scope.businessList = BusinessData.getSelectedBusiness($stateParams.service); });
解决方法 1:
controller.js
.controller('ServiceCtrl', function($scope, ServicesData, BusinessData, $stateParams) { $scope.service = ServicesData.getSelectedService($stateParams.service); $scope.businessList = BusinessData.getSelectedBusiness($stateParams.service); $scope.ratings = { current: 5, max: 10 };
和也修改service.html
<div></div>
以上就是Angularjs渲染的 using 指令的星级评分系统示例的详细内容,更多请关注gaodaima搞代码网其它相关文章!