我在组件ts文件中使用了这段代码
wheelSpinning = false;
constructor() {
}
ngAfterViewInit() {
this.initWheel();
}
initWheel() {
this.wheel = new Winwheel({
'numSegments': 8, // Specify number of segments.
'outerRadius': 155, // Set radius to so wheel fits the background.
'innerRadius': 150, // Set inner radius to make wheel hollow.
'pointerAngle': 90,
'textFontSize':0,
'segments': // Define segments including colour and text.
[
{ 'fillStyle': '#eae56f', 'text': 'Prize 1' },
{ 'fillStyle': '#89f26e', 'text': 'Prize 2' },
{ 'fillStyle': '#7de6ef', 'text': 'Prize 3' },
{ 'fillStyle': '#e7706f', 'text': 'Prize 4' },
{ 'fillStyle': '#eae56f', 'text': 'Prize 5' },
{ 'fillStyle': '#89f26e', 'text': 'Prize 6' },
{ 'fillStyle': '#7de6ef', 'text': 'Prize 7' },
{ 'fillStyle': '#e7706f', 'text': 'Prize 8' }
],
//'segments' : this.getSegments(),
'animation': // Define spin to stop animation.
{
'type': 'spinToStop',
'duration': 5,
'spins': 8,
'callbackFinished': 'alertPrize()'
},
});
}
startSpin() {
// Ensure that spinning can't be clicked again while already running.
if (this.wheelSpinning === false) {
this.wheel.startAnimation();
this.wheelSpinning = true;
}
}
resetWheel() {
this.wheel.stopAnimation(false); // Stop the animation, false as param so does not call callback function.
this.wheel.rotationAngle = 0; // Re-set the wheel angle to 0 degrees.
this.wheel.draw(); // Call draw to render changes to the wheel.
this.wheelSpinning = false; // Reset to false to power buttons and spin can be clicked again.
}
ngOnInit() {
}
}
然后在index.html中使用此函数。
// This function called after the spin animation has stopped.
function alertPrize() {
var winningSegment = this.wheel.getIndicatedSegment();
alert(winningSegment);
console.log("You have won " + winningSegment.text + "!");
}
但它说“getIndicatedSegment”未定义。
这里的任何解决方案?
答案 0 :(得分:0)
该错误告诉您究竟是什么问题。
initWheel
(new Winwheel({...})
)中的逻辑是个问题。 Winwheel
类没有getIndicatedSegment
方法。要么就是那个,或者那个方法还没有在运行时创建(但我怀疑是这样的)。如果您正在使用lib,它应该静态存在。
因此,请确保调用存在的方法。