本文介绍Angularjs渲染的使用指令的星级评分系统示例,分享给大家,具体如下:
我试图创建静态使用angularjs/离子成效甚微的星级评分系统。但目前什么都不输出到屏幕上……我是我做错了吗?
service.html
& lt; ion-list>
& lt; ion-item ng-repeat="业务在businessList跟踪美元指数”类=癷tem-icon-right”比;
& lt; h3> {{business.name}} & lt;/h3>{{业务。距离}}英里
& lt; br>
& lt; div星级额定值=" https://www.yisu.com/zixun/{{business.rating}} " max=皉ating.max祝辞& lt;/div>
& lt;我class="图标ion-chevron-right icon-accessory”祝辞& lt;/i>
& lt;/ion-item>
& lt;/ion-list>
之前
directives.js
angular.module(“起动器。指令”,[])
.directive (starRating,函数(){
返回{
限制:' A ',
模板:' & lt; ul类=捌兰丁痹凇?
李的& lt; ng-repeat=懊餍敲餍恰眓g-class=懊餍恰痹凇?
‘\ u2605 +
+ & lt;/li>
“& lt;/ul>”
范围:{
ratingValue:“=?
马克斯:“=?
},
链接:函数(范围、elem attrs) {
范围。明星=[];
(var=0;我& lt;scope.max;我+ +){
scope.stars.push ({
满:我& lt;scope.rating
});
}
}
}
});
之前
services.js
.service (“BusinessData”,[函数(){
var businessData=https://www.yisu.com/zixun/[
{
id: 1、
serviceId: 1、
名称:“世界中心车库”,
距离:0.1,
等级:4
}
];
返回{
getAllBusinesses:函数(){
返回businessData;
},
getSelectedBusiness:函数(serviceId) {
var businessList=[];
serviceId=方法(serviceId);
(i=0; i< businessData.length;我+ +){
如果(businessData[我]。serviceId===serviceId) {
businessList.push (businessData[我]);
}
}
返回businessList;
}
}
}))
之前
controller.js
范式(ServiceCtrl,函数($范围ServicesData BusinessData, stateParams美元){
美元的范围。服务=ServicesData.getSelectedService ($ stateParams.service);
美元的范围。businessList=BusinessData.getSelectedBusiness ($ stateParams.service);
});
之前
<>强解决方法1:
controller.js
范式(ServiceCtrl,函数($范围ServicesData BusinessData, stateParams美元){
美元的范围。服务=ServicesData.getSelectedService ($ stateParams.service);
美元的范围。businessList=BusinessData.getSelectedBusiness ($ stateParams.service);
美元的范围。评级={
当前:5
马克斯:10
};
之前
和也修改service.html
& lt; div星级额定值=" https://www.yisu.com/zixun/rating.current " max=皉ating.max祝辞& lt;/div>
以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持。
