登录过程完成后,使用导航(RouterExtensions)加载一个简单的组件页面。该组件仅显示来自数组的随机短语。
有时(并非总是如此),只有大约20%的时间,该组件发生故障,并出现一个不确定的属性短语错误。在模拟器和设备中都会失败。
这是组件的代码:
HTML
<StackLayout class="stack-layout-1" horizontalAlignment="center" verticalAlignment="center" backgroundColor="#292731">
<GridLayout rows="*, auto, auto, auto">
<Image row="0" src="~/images/bulb.png" class="slide-image"></Image>
<Label row="1" [text]="phrase.phrase" class="h4 m-x-20 primary-text" textWrap="true"></Label>
<Label row="2" [text]="phrase.author" class="text-right m-r-30 secondary-text"></Label>
<Button row="3" text="Continuar" (tap)="onTapContinue()" class="btn btn-primary btn-rounded-sm" height="50"></Button>
</GridLayout>
TS
import { Component, OnInit } from '@angular/core';
import { RouterExtensions } from 'nativescript-angular/router';
import { Page } from 'tns-core-modules/ui/page';
import { Phrase } from '../../models/phrase.model';
import { HelpersService } from './../../services/helpers.service';
import { ConfigService } from './../../services/config.service';
@Component({
selector: 'ns-phrases',
templateUrl: './phrases.component.html',
styleUrls: ['./phrases.component.css'],
moduleId: module.id,
})
export class PhrasesComponent implements OnInit {
public phrase: Phrase = new Phrase();
constructor(private routerExtensions: RouterExtensions,
private page: Page,
private configService: ConfigService,
private helpersService: HelpersService) { }
ngOnInit() {
this.page.actionBarHidden = true;
// Get random phrase
this.phrase = this.configService.PHRASES[this.helpersService.getRandomNumber(1, 6)];
}
public async onTapContinue() {
await this.routerExtensions.navigate(['/home'], {
clearHistory: true,
transition: {
name: 'slideTop',
duration: 350,
curve: 'ease'
}
});
}
}
短语类
export class Phrase {
phraseId: number;
phrase: string;
author: string;
constructor() {
this.phraseId = 0;
this.phrase = 'Vaya, esto es un poco embarazoso... No he podido cargar la frase del día.';
this.author = 'Tu App móvil';
}
}
该短语用一些默认值初始化。 错误是:
错误TypeError:无法读取未定义的属性“短语”
关于为什么有时会发生这种情况的任何想法? 问候 何塞