ionic V3.10 開發踩坑集錦(一)

最近在用ionic 開發程式，把踩過的坑記下來和大家分享下，希望對其他人有幫助。版本號如下：

ionic: 3.10.3
cordova: 7.0.1

之前寫過一篇V3.3的踩坑集錦，地址如下：ionic V3.3開發踩坑集錦，假如兩者有衝突的地方，以這篇為準。

在子介面的html中設定ion-nav標籤，會自動新增上返回箭頭，而在rootPage中自動去掉它。在瀏覽器中除錯時，儲存新增ion-nav的修改，瀏覽器自動重新整理，但是並未顯示修改，將瀏覽器的地址修改成localhost:8100,重新執行即可。原因是儲存自動重新整理會將此子頁面放置在root中，所以返回鍵不會出現。
使用ionic generate page demo建立新的介面，然後從其他介面跳轉過去，可能會報錯cannot find module '../demo'，此時嘗試中斷執行，重新鍵入ionic serve執行。

ionic 時間選擇器的用法：

html:

 <ion-datetime displayFormat="YYYY年MM月" cancelText="取消" doneText="確定" [(ngModel)]="myDate" (ngModelChange)="changeDate($event)"></ion-datetime>
複製程式碼

ts:

 private myDate='2017-10';// 注意：一定要寫成‘YYYY-MM-DD’這樣的形式，不要寫成‘YYYY/MM/DD’等其他的樣式，不用與ion-datetime標籤設定的樣式一樣
複製程式碼

可以在app.module.ts中設定子介面隱藏Tab，程式碼如下：

  import { ErrorHandler, NgModule } from '@angular/core';
  import { BrowserModule } from '@angular/platform-browser';
  import { IonicApp, IonicErrorHandler, IonicModule } from 'ionic-angular';
  import { MyApp } from './app.component';
  @NgModule({
    declarations: [
     MyApp,
   ],
   imports: [
     BrowserModule,
    IonicModule.forRoot(MyApp, {
    tabsHideOnSubPages: true // 主要是這句，參見：http://ionicframework.com/docs/api/config/Config/
      })
   ],
   bootstrap: [IonicApp],
  entryComponents: [
    MyApp,
  ],
  providers: []

  })
  export class AppModule { }
複製程式碼

使用Echarts，直接通過npm安裝，然後在使用的檔案中import echarts from 'echarts';，簡單方便。這個本質是Angular如何安裝第三方js庫，具體可以參見：https://segmentfault.com/q/1010000010230463

ionic V3.10 開發踩坑集錦(一)

推薦

相關文章