作者： | 来源：互联网 | 2023-09-25 14:15
最近在运用ionic2的开发中，遇到了一个“奇怪”的事情：某个页面中，有用click事件来改变页面元素中的a标签的active(一个class)来控制元素是否选中。在浏览器和android实机中
最近在运用ionic2的开发中，遇到了一个“奇怪”的事情：某个页面中，有用click事件来改变页面元素中的a标签的active(一个class)来控制元素是否选中。在浏览器和android实机中工作正常，可是到了ios实机中，a标签不会变化。debug发现在ios上click事件中的所有代码都执行了，但是页面没有刷新。于是在每个click的事件代码的最后加上this.changeDetectorRef.detectChanges(),手动让这个页面执行变化检测，问题解决。但问题是，按照angular2的特性，所有的click事件都应该会自动触发整个组件树的变化检测，为什么这个页面在ios中失效了，有哪位大神知道原因吗？
完整代码：
1.setting.module.ts：
import { NgModule } from '@angular/core';
import { IonicPageModule } from 'ionic-angular';
import {SettingPage} from "./setting";
import {SharedModule} from "../../../../../app/shared.module";
@NgModule({
declarations: [
],
imports: [
1
| IonicPageModule.forChild(SettingPage),SharedModule |
],
})
export class SettingModule {}
2.setting.ts
import {ChangeDetectorRef, Component, OnInit} from '@angular/core';
import {IonicPage, NavController, NavParams} from 'ionic-angular';
import {AlertService} from "../../../../../service/alert.service";
import {AppHttp} from "../../../../../service/app-http.service";
import {SettingService} from "./setting.service";
@IonicPage()
@Component({
1
2
| selector: 'setting',
templateUrl: 'setting.html' |
})
export class SettingPage{
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
| constructor(public settingService: SettingService,public navCtrl: NavController,public navParams: NavParams,public http:AppHttp ,public alertService:AlertService,public cd:ChangeDetectorRef) {
}
ionViewDidLoad(){
}
ionViewWillEnter(){
}
chooseOddsType(type){
if(this.settingService.setting.settingJson.oddsType!=type){
this.settingService.setting.settingJson.oddsType=type;
}
//this.cd.detectChanges();不加这行在iOS中就有问题
}
chooseGoalTip(type){
if(!this.settingService.setting.settingJson.goalTip){
this.settingService.setting.settingJson.goalTip=[];
}
for (let j = 0; j
if (type ==this.settingService.setting.settingJson.goalTip[j]) {
this.settingService.setting.settingJson.goalTip.splice(j,1);
this.cd.detectChanges();
return;
}
}
this.settingService.setting.settingJson.goalTip.push(type);
//this.cd.detectChanges();不加这行在iOS中就有问题
}
chooseRedCardTip(type){
if(!this.settingService.setting.settingJson.redCardTip){
this.settingService.setting.settingJson.redCardTip=[];
}
for (let j = 0; j
if (type ==this.settingService.setting.settingJson.redCardTip[j]) {
this.settingService.setting.settingJson.redCardTip.splice(j,1);
//this.cd.detectChanges();不加这行在iOS中就有问题
return;
}
}
this.settingService.setting.settingJson.redCardTip.push(type);
//this.cd.detectChanges();不加这行在iOS中就有问题
}
isRedCardTipActive(type){
for(let i=0;i
if(this.settingService.setting.settingJson.redCardTip[i]==type){
return true;
}
}
return false;
}
isGoalTipActive(type){
for(let i=0;i
if(this.settingService.setting.settingJson.goalTip[i]==type){
return true;
}
}
return false;
} |
}
3.setting.html：
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
| 提示设置
- 赔率公司 {{settingService.setting.settingJson?.provider?.description}}
- 数据类型
- 进球提示
- 红牌提示
- 仅提示关注的（进球提示与红牌提示）
tappable (click)="settingService.setting.settingJson.tipForFocusMatchesOnly=!settingService.setting.settingJson.tipForFocusMatchesOnly;cd.detectChanges();">
排名显示
tappable (click)="settingService.setting.settingJson.showRank=!settingService.setting.settingJson.showRank;cd.detectChanges();">
|
京公网安备 11010802041100号