JS與App交互得例子太多了，這里就不多說了营勤，這里記錄Angular2+與App交互遇到的兩個(gè)問題
1灵嫌、回調(diào)方法掛載
當(dāng)App端調(diào)用JS代碼時(shí)，由于Angular用TypeScript語言,編譯后方法名葛作、類名已不復(fù)存在寿羞。為了解決找不到該方法問題，在TS在中將方法掛載在Window對象上
TS掛載
window['AppComponent'][bridgeName] = func
App調(diào)用
window['AppComponent'][bridgeName]()
Angular調(diào)用App 可以直接寫在TS中如下
callIOS(params: string) {
try {
window['webkit'].messageHandlers.callRouter.postMessage(params)
} catch (e) {
console.log(e)
}
}
callAndroid(params: string) {
try {
window['bridge'].callRouter(params)
} catch (e) {
console.log(e)
}
}
2赂蠢、方法刷新異常绪穆、路由跳轉(zhuǎn)異常
由App端發(fā)調(diào)用JS事件，瀏覽器處理為異步事件虱岂。頁面會(huì)出現(xiàn)無法跳轉(zhuǎn)玖院、數(shù)據(jù)刷新一半后停止等異常問題。
Navigation triggered outside Angular zone, did you forget to call 'ngZone.run()'?
引入ngZone
// 不檢查變更
this.zone.runOutsideAngular(() => {
});
// 檢查變更
this.zone.run(() => {
this.router.navigateByUrl(uri)).then()
});
//
this.zone.runOutsideAngular(() => {
// 處理完后檢查變更
this.zone.run(() => {
});
});
window['AppComponent'][bridgeName] => {
this.zone.run(() => {
// App傳來的參數(shù)觸發(fā)變更檢測 頁面刷新寫在這里 少量數(shù)據(jù)可能不會(huì)造成頁面渲染不完全的問題
});
}
// 有一種使用GCD的感覺
