月份: 十月 2017

發表於 程式分享

ionic cordova plugin add cordova-plugin-qrscanner執行錯誤之處理

發表於 由Grace撰寫

執行

ionic cordova plugin add cordova-plugin-qrscanner

出現

Failed to install 'cordova-plugin-qrscanner': CordovaError: Failed to fetch plugin cordova-plugin-swift-support via registry.
Probably this is either a connection problem, or plugin spec is incorrect.
Check your connection and plugin name/version/URL.
Error: cmd: Command failed with exit code 4294963238 Error output:
...

後找到說明，加上參數

ionic cordova plugin add cordova-plugin-qrscanner --nofetch

Ref.https://cordova.apache.org/news/2017/05/04/cordova-7.html

發表於 程式分享

執行npm install 出現 npm ERR! Please try running this command again as root/Administrator處理方式

發表於 由Grace撰寫

此指令執行
npm install -g webpack webpack-dev-server typescript –verbose
會出現 npm ERR! Please try running this command again as root/Administrator
網路上的解法是用sudo，
但為windows環境，
找到的解法是加上–no-optional參數就可正確執行了
npm install -g webpack webpack-dev-server typescript –verbose –no-optional

發表於 程式分享

typescript之三: 類別說明

發表於 由Grace撰寫

1.class.ts

    
//1.class
console.log('1.class');
class House {
    //private door: number;
    constructor(public door: number) {
        this.door = door;
    }
    
    getDoor(width: number, height: number) {
        console.log('size: ' + (width * height * this.door));
    }
    
    public retriveDoor() {
        return this.door;
    }
}

let house = new House(5);
house.getDoor(20, 30);

class NewHouse extends House {
    name: string;
    constructor(door: number, name: string) {
        super(door);
        this.name = name;        
    }
    
    getDoor(width: number, height: number) {
        console.log('name: ' + this.name);
        console.log('door: ' + super.retriveDoor());
        super.getDoor(width, height);
    }
}

let newHouse = new NewHouse(5, 'Grace');
newHouse.getDoor(25, 30);

//2.class
console.log('2.abstract class');
abstract class Shape {
    abstract area(): number;
    myname(): void {
        console.log('My name is shape');
    }
}

class Rect extends Shape {
    area(): number {
        return 100;
    }
}

let shape: Shape;
//error TS2511: Cannot create an instance of the abstract class 'Shape'
//shape = new Shape();
shape = new Rect();
console.log('shape.area(): ' + shape.area());

2.compiler
tsc class.ts

3.產出的 class.js

    
var __extends = (this && this.__extends) || (function () {
    var extendStatics = Object.setPrototypeOf ||
        ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
        function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
    return function (d, b) {
        extendStatics(d, b);
        function __() { this.constructor = d; }
        d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
    };
})();
//1.class
console.log('1.class');
var House = /** @class */ (function () {
    //private door: number;
    function House(door) {
        this.door = door;
        this.door = door;
    }
    House.prototype.getDoor = function (width, height) {
        console.log('size: ' + (width * height * this.door));
    };
    House.prototype.retriveDoor = function () {
        return this.door;
    };
    return House;
}());
var house = new House(5);
house.getDoor(20, 30);
var NewHouse = /** @class */ (function (_super) {
    __extends(NewHouse, _super);
    function NewHouse(door, name) {
        var _this = _super.call(this, door) || this;
        _this.name = name;
        return _this;
    }
    NewHouse.prototype.getDoor = function (width, height) {
        console.log('name: ' + this.name);
        console.log('door: ' + _super.prototype.retriveDoor.call(this));
        _super.prototype.getDoor.call(this, width, height);
    };
    return NewHouse;
}(House));
var newHouse = new NewHouse(5, 'Grace');
newHouse.getDoor(25, 30);
//2.class
console.log('2.abstract class');
var Shape = /** @class */ (function () {
    function Shape() {
    }
    Shape.prototype.myname = function () {
        console.log('My name is shape');
    };
    return Shape;
}());
var Rect = /** @class */ (function (_super) {
    __extends(Rect, _super);
    function Rect() {
        return _super !== null && _super.apply(this, arguments) || this;
    }
    Rect.prototype.area = function () {
        return 100;
    };
    return Rect;
}(Shape));
var shape;
//error TS2511: Cannot create an instance of the abstract class 'Shape'
//shape = new Shape();
shape = new Rect();
console.log('shape.area(): ' + shape.area());

4.執行結果
1.PNG

發表於 程式分享

typescript之二: 函數說明

發表於 由Grace撰寫

1.fnuc.ts


//1.two parameter
console.log('1.two parameter');
function max1(x: number, y: number): number {
    return (x > y) ? x : y;
}

let result_max1 = max1(33, 66);
console.log('result_max1: ' + result_max1);

//2.1 ~ 2 parameter
console.log('2.1 ~ 2 parameter');
function max2(x: number, y?: number): number {
    if (y)
        return (x > y) ? x : y;
    else
        return x;
}

let result_max2 = max2(33);
console.log('result_max2: ' + result_max2);

//3.default parameter
console.log('3.default parameter');
function max3(x: number, y = 44): number {
    return (x > y) ? x : y;    
}

let result_max3_1 = max3(33);
console.log('result_max3_1: ' + result_max3_1);

let result_max3_2 = max3(33, 22);
console.log('result_max3_2: ' + result_max3_2);

let result_max3_3 = max3(33, undefined);
console.log('result_max3_3: ' + result_max3_3);

//4.first default parameter
console.log('4.first default parameter');
function max4(x: number = 44, y : number): number {
    return (x > y) ? x : y;    
}

let result_max4_1 = max4(undefined, 33);
console.log('result_max4_1: ' + result_max4_1);

let result_max4_2 = max4(22, 33);
console.log('result_max4_2: ' + result_max4_2);

//5.many paramter
console.log('5.many paramter');
function sum(x: number, ...numbers: number[]): number {
    let total = x;
    for (let idx = 0; idx < numbers.length; idx++)         total += numbers[idx];     return total; } let total = sum(1, 2, 3, 4, 5); console.log('total: ' + total); //6.function overload console.log('6.function overload'); function func(config: number[]); function func(config: number, value: number); function func(config: string, value: string); function func(config: any, value?: any) {     console.log('config: ' + config);     console.log('value: ' + value); } console.log('func ==> ');
func([5, 6]);
console.log('func ==> ');
func('test1', 'test2');
console.log('func ==> ');
func(1, 2);

//7.this
console.log('7.this');
let data = {
    datas: ['data1', 'data2', 'data3', 'data4'],
    dataPicker: function() {
        return () => {
            let pickedIdx = Math.floor(Math.random() * 4);
            return this.datas[pickedIdx];
        }
    }
}

let pickData = data.dataPicker();
console.log('pickData(): ' + pickData());

2.compiler
tsc func.ts

3.產出的 func.js


//1.two parameter
console.log('1.two parameter');
function max1(x, y) {
    return (x > y) ? x : y;
}
var result_max1 = max1(33, 66);
console.log('result_max1: ' + result_max1);
//2.1 ~ 2 parameter
console.log('2.1 ~ 2 parameter');
function max2(x, y) {
    if (y)
        return (x > y) ? x : y;
    else
        return x;
}
var result_max2 = max2(33);
console.log('result_max2: ' + result_max2);
//3.default parameter
console.log('3.default parameter');
function max3(x, y) {
    if (y === void 0) { y = 44; }
    return (x > y) ? x : y;
}
var result_max3_1 = max3(33);
console.log('result_max3_1: ' + result_max3_1);
var result_max3_2 = max3(33, 22);
console.log('result_max3_2: ' + result_max3_2);
var result_max3_3 = max3(33, undefined);
console.log('result_max3_3: ' + result_max3_3);
//4.first default parameter
console.log('4.first default parameter');
function max4(x, y) {
    if (x === void 0) { x = 44; }
    return (x > y) ? x : y;
}
var result_max4_1 = max4(undefined, 33);
console.log('result_max4_1: ' + result_max4_1);
var result_max4_2 = max4(22, 33);
console.log('result_max4_2: ' + result_max4_2);
//5.many paramter
console.log('5.many paramter');
function sum(x) {
    var numbers = [];
    for (var _i = 1; _i < arguments.length; _i++) {
        numbers[_i - 1] = arguments[_i];
    }
    var total = x;
    for (var idx = 0; idx < numbers.length; idx++)         total += numbers[idx];     return total; } var total = sum(1, 2, 3, 4, 5); console.log('total: ' + total); //6.function overload console.log('6.function overload'); function func(config, value) {     console.log('config: ' + config);     console.log('value: ' + value); } console.log('func ==> ');
func([5, 6]);
console.log('func ==> ');
func('test1', 'test2');
console.log('func ==> ');
func(1, 2);
//7.this
console.log('7.this');
var data = {
    datas: ['data1', 'data2', 'data3', 'data4'],
    dataPicker: function () {
        var _this = this;
        return function () {
            var pickedIdx = Math.floor(Math.random() * 4);
            return _this.datas[pickedIdx];
        };
    }
};
var pickData = data.dataPicker();
console.log('pickData(): ' + pickData());

4.執行結果
1.PNG

發表於 程式分享

typescript之一: 基本型態說明

發表於 由Grace撰寫

1.basicType.ts


//1.boolean
console.log('1.boolean');

let flag: boolean = true;
console.log('flag: ' + flag);

//2.number
console.log('2.number');

let binaryLiteral: number = 0b11010;
let octalLiteral: number = 0o622;
let decLiteral: number = 12;
let hexLiteral: number = 0xb00a;

console.log('binaryLiteral :' + binaryLiteral);
console.log('octalLiteral :' + octalLiteral);
console.log('decLiteral :' + decLiteral);
console.log('hexLiteral :' + hexLiteral);

//3.string
console.log('3.string');

let prog: string = "Angular 2";
let seconds: number = 55;
let data: string = `這程式是 ${prog}, 經過 ${ seconds } 秒`;

console.log('prog :' + prog);
console.log('seconds :' + seconds);
console.log('data :' + data);

//4.number array
console.log('4.number array');
let numarr1: number[] = [4, 3, 2, 1];
let numarr2: Array = [1, 2];

console.log('numarr1.length :' + numarr1.length);
numarr1.forEach(function (num1) {
    console.log('num1: ' + num1);
}.bind(this));

console.log('numarr2.length :' + numarr2.length);
numarr2.forEach(function (num2) {
    console.log('num2: ' + num2);
}.bind(this));

//5.mix array
console.log('5.mix array');
let mixarr: [string, string, number, number];
mixarr = ['string1', 'string2', 2, 1];

console.log('mixarr.length :' + mixarr.length);
mixarr.forEach(function (data1) {
    console.log('data1: ' + data1);
}.bind(this));

//6.enum
console.log('6.enum');
enum Shape { Circle, Rect, Oval };
let s: Shape = Shape.Oval;
console.log('s: ' + s);

enum Shape2 { Circle = 9, Rect, Oval = 6 };
let s2: Shape2 = Shape2.Rect;
console.log('s2: ' + s2);

//7.any
console.log('7.any');
let any1: any = 1;
console.log('any1: ' + any1);
//console.log('any1.ifItExists(): ' + any1.ifItExists());
console.log('any1.toFixed(): ' + any1.toFixed());

any1 = '程式';
console.log('any1: ' + any1);
//console.log('any1.ifItExists(): ' + any1.ifItExists());
//console.log('any1.toFixed(): ' + any1.toFixed());

any1 = false;
console.log('any1: ' + any1);
//console.log('any1.ifItExists(): ' + any1.ifItExists());
//console.log('any1.toFixed(): ' + any1.toFixed());

let array: any[] = [ true, "hello", 333 ];
array.forEach(function (arrdata1) {
    console.log('arrdata1: ' + arrdata1);
}.bind(this));

array[2] = "yes";
array.forEach(function (arrdata2) {
    console.log('arrdata2: ' + arrdata2);
}.bind(this));

//8.null and undefined
console.log('8.null and undefined');
let nulldata : number;
nulldata = 3;
console.log('nulldata: ' + nulldata);

nulldata = undefined;
console.log('nulldata: ' + nulldata);

nulldata = null;
console.log('nulldata: ' + nulldata);

let nulldata2 : number | undefined;
nulldata2 = 3;
console.log('nulldata2: ' + nulldata2);

nulldata2 = undefined;
console.log('nulldata2: ' + nulldata2);

nulldata2 = null;
console.log('nulldata2: ' + nulldata2);

let nulldata3 : number | null | undefined;
nulldata3 = 3;
console.log('nulldata3: ' + nulldata3);

nulldata3 = undefined;
console.log('nulldata3: ' + nulldata3);

nulldata3 = null;
console.log('nulldata3: ' + nulldata3);

//9.void
console.log('9.void');
function func1(): void {
    console.log('test for func1()');
}

func1();

//10.never
console.log('10.never');
let val1: never;
let val2: number;

//compiler => error TS2322: Type '333' is not assignable to type 'never'.
//val1 = 333;
//val1 = (() => { throw new Error('val1: Exception occur for nerver') })();
//val2 = (() => { throw new Error('val2: Exception occur for nerver') })();

//11.const
const CONSTVAL = 123;
const hello = {
  title: "Hi",
  content: CONSTVAL
};

console.log('hello.title: ' + hello.title);
console.log('hello.content: ' + hello.content);

//12.數值結構
console.log(`12.數值結構`);
let fromData = [1, 3];
let [one, three] = fromData;

console.log('one: ' + one);
console.log('three: ' + three);

function func2([first, second]: [number, number]) {
    console.log(first + second);
}

func2([33, 44]);

let [first, ...rest] = [4, 3, 2, 1];
console.log('first: ' + first);
console.log('rest: ' + rest);

//13.結構
console.log(`13.結構`);
let arraytest = { a: 3, b: 15, w: 6, h: 30};
let { a, b, w, h } = arraytest;
console.log(a, b, w, h);

2.compiler
tsc basicType.ts

3.產出的basicType.js


//1.boolean
console.log('1.boolean');
var flag = true;
console.log('flag: ' + flag);
//2.number
console.log('2.number');
var binaryLiteral = 26;
var octalLiteral = 402;
var decLiteral = 12;
var hexLiteral = 0xb00a;
console.log('binaryLiteral :' + binaryLiteral);
console.log('octalLiteral :' + octalLiteral);
console.log('decLiteral :' + decLiteral);
console.log('hexLiteral :' + hexLiteral);
//3.string
console.log('3.string');
var prog = "Angular 2";
var seconds = 55;
var data = "\u9019\u7A0B\u5F0F\u662F " + prog + ", \u7D93\u904E " + seconds + " \u79D2";
console.log('prog :' + prog);
console.log('seconds :' + seconds);
console.log('data :' + data);
//4.number array
console.log('4.number array');
var numarr1 = [4, 3, 2, 1];
var numarr2 = [1, 2];
console.log('numarr1.length :' + numarr1.length);
numarr1.forEach(function (num1) {
    console.log('num1: ' + num1);
}.bind(this));
console.log('numarr2.length :' + numarr2.length);
numarr2.forEach(function (num2) {
    console.log('num2: ' + num2);
}.bind(this));
//5.mix array
console.log('5.mix array');
var mixarr;
mixarr = ['string1', 'string2', 2, 1];
console.log('mixarr.length :' + mixarr.length);
mixarr.forEach(function (data1) {
    console.log('data1: ' + data1);
}.bind(this));
//6.enum
console.log('6.enum');
var Shape;
(function (Shape) {
    Shape[Shape["Circle"] = 0] = "Circle";
    Shape[Shape["Rect"] = 1] = "Rect";
    Shape[Shape["Oval"] = 2] = "Oval";
})(Shape || (Shape = {}));
;
var s = Shape.Oval;
console.log('s: ' + s);
var Shape2;
(function (Shape2) {
    Shape2[Shape2["Circle"] = 9] = "Circle";
    Shape2[Shape2["Rect"] = 10] = "Rect";
    Shape2[Shape2["Oval"] = 6] = "Oval";
})(Shape2 || (Shape2 = {}));
;
var s2 = Shape2.Rect;
console.log('s2: ' + s2);
//7.any
console.log('7.any');
var any1 = 1;
console.log('any1: ' + any1);
//console.log('any1.ifItExists(): ' + any1.ifItExists());
console.log('any1.toFixed(): ' + any1.toFixed());
any1 = '程式';
console.log('any1: ' + any1);
//console.log('any1.ifItExists(): ' + any1.ifItExists());
//console.log('any1.toFixed(): ' + any1.toFixed());
any1 = false;
console.log('any1: ' + any1);
//console.log('any1.ifItExists(): ' + any1.ifItExists());
//console.log('any1.toFixed(): ' + any1.toFixed());
var array = [true, "hello", 333];
array.forEach(function (arrdata1) {
    console.log('arrdata1: ' + arrdata1);
}.bind(this));
array[2] = "yes";
array.forEach(function (arrdata2) {
    console.log('arrdata2: ' + arrdata2);
}.bind(this));
//8.null and undefined
console.log('8.null and undefined');
var nulldata;
nulldata = 3;
console.log('nulldata: ' + nulldata);
nulldata = undefined;
console.log('nulldata: ' + nulldata);
nulldata = null;
console.log('nulldata: ' + nulldata);
var nulldata2;
nulldata2 = 3;
console.log('nulldata2: ' + nulldata2);
nulldata2 = undefined;
console.log('nulldata2: ' + nulldata2);
nulldata2 = null;
console.log('nulldata2: ' + nulldata2);
var nulldata3;
nulldata3 = 3;
console.log('nulldata3: ' + nulldata3);
nulldata3 = undefined;
console.log('nulldata3: ' + nulldata3);
nulldata3 = null;
console.log('nulldata3: ' + nulldata3);
//9.void
console.log('9.void');
function func1() {
    console.log('test for func1()');
}
func1();
//10.never
console.log('10.never');
var val1;
var val2;
//compiler => error TS2322: Type '333' is not assignable to type 'never'.
//val1 = 333;
//val1 = (() => { throw new Error('val1: Exception occur for nerver') })();
//val2 = (() => { throw new Error('val2: Exception occur for nerver') })();
//11.const
var CONSTVAL = 123;
var hello = {
    title: "Hi",
    content: CONSTVAL
};
console.log('hello.title: ' + hello.title);
console.log('hello.content: ' + hello.content);
//12.數值結構
console.log("12.\u6578\u503C\u7D50\u69CB");
var fromData = [1, 3];
var one = fromData[0], three = fromData[1];
console.log('one: ' + one);
console.log('three: ' + three);
function func2(_a) {
    var first = _a[0], second = _a[1];
    console.log(first + second);
}
func2([33, 44]);
var _a = [4, 3, 2, 1], first = _a[0], rest = _a.slice(1);
console.log('first: ' + first);
console.log('rest: ' + rest);
//13.結構
console.log("13.\u7D50\u69CB");
var arraytest = { a: 3, b: 15, w: 6, h: 30 };
var a = arraytest.a, b = arraytest.b, w = arraytest.w, h = arraytest.h;
console.log(a, b, w, h);

4.執行結果
1.PNG
2.PNG
3.PNG

發表於 程式分享

ionic2 產生 event並儲存最後時間，並以Timer去計算

發表於 由Grace撰寫

1.tabs.tsc


import { Component } from '@angular/core';
import { IonicPage, NavController, MenuController, Events } from 'ionic-angular';
import { Subscription } from "rxjs";
import { TimerObservable } from "rxjs/observable/timerObservable";

@IonicPage()
@Component({
  selector: 'page-tabs',
  templateUrl: 'tabs.html'
})
export class TabsPage {
  lastPing?: Date = null;
  private subscription: Subscription;
  
  constructor(public navCtrl: NavController, public menuCtrl: MenuController, public events: Events) {
  }
  
  ionViewDidLoad() {
    this.lastPing = new Date();
    this.events.subscribe('user:click', (info, time) => {
        console.log('user:click', info, 'at', time);
        this.lastPing = new Date();
    });
    
    let timer = TimerObservable.create(20000, 5000);
    this.subscription = timer.subscribe(t => {
      console.log('ionViewDidLoad t: ' + t);
      
      var now = new Date();
      var diff = this.toSeconds(now - this.lastPing);
      console.log(diff.toString());

    });
  }
  
  toSeconds(diff) {
      var ms = diff % 1000;
      diff = (diff - ms) / 1000;
      var secs = diff % 60;
      diff = (diff - secs) / 60;
      var mins = diff % 60;
      
      return mins;
  }
  
  ionViewDidLeave() {
    this.subscription.unsubscribe();
  }
    
  openMenu(menuId : any) {
    this.events.publish('user:click', 'openMenu', Date.now());    
  }  
}

2.結果畫面
1.PNG

發表於 程式分享

ionic2 產生 QRCode

發表於 由Grace撰寫

ionic2 產生 QRCode
1.安裝
cd [ionic Project Directory]
npm install angularx-qrcode –save
2.qrcode.module.ts


import { NgModule } from '@angular/core';
import { IonicPageModule } from 'ionic-angular';
import { QRCodeModule } from 'angularx-qrcode';
import { QrcodePage } from './qrcode';

@NgModule({
  declarations: [
    QrcodePage
  ],
  imports: [
    IonicPageModule.forChild(QrcodePage),
    QRCodeModule
  ]
})
export class QrcodePageModule {}

3.qrcode.tsc


import { Component } from '@angular/core';
import { IonicPage, NavController, NavParams } from 'ionic-angular';
import { QRCodeModule } from 'angularx-qrcode';

@IonicPage()
@Component({
  selector: 'page-qrcode',
  templateUrl: 'qrcode.html'
})
export class QrcodePage {
  encodeData2 : string = '1234';
  
  constructor(public navCtrl: NavController, public navParams: NavParams, private qrScanner: QRScanner) {
  }

  ionViewDidLoad() {
    console.log('ionViewDidLoad QrcodePage');
  }
}

4.qrcode.html

<ion-header>
 <ion-navbar>
 <ion-title text-center>QRCode</ion-title>
 </ion-navbar>
</ion-header>
<ion-content padding>
 <ion-card>
 <ion-card>
 <qrcode [qrdata]="'My QR code data string'" [size]="256" [level]="'M'"></qrcode>
 </ion-card>
 </ion-card>
 
 <ion-card>
 <ion-card-header class="text-c">
 <ion-input type="text" [(ngModel)]="encodeData2" name="encodeData2" placeholder="請輸入QRCode"></ion-input>
 </ion-card-header>
 <ion-card>
 <qrcode [qrdata]="encodeData2" [size]="256" [level]="'M'"></qrcode>
 </ion-card>
 </ion-card>
</ion-content>

5.結果畫面
1.PNG

參考: https://github.com/Cordobo/angularx-qrcode

發表於 程式分享

request JSON出現No ‘Access-Control-Allow-Origin’ header is present及OPTIONS 405 Method Not Allowed

發表於 由Grace撰寫

一、Tomcat8
由ionic2 撰寫 App POST 呼叫Tomcat8 Server程式時出現
No ‘Access-Control-Allow-Origin’ header is present，
雖於Chrome加上Allow-Control-Allow-Origin擴充功能，
1.PNG
仍出現錯誤訊息OPTIONS 405 Method Not Allowed，
經查原因
因為在跨域且嘗試添加一些特殊頭及自定義頭的情況下，
由於瀏覽器的安全機制 會加多一次OPTIONS預請求（詢問請求），
與跨域服務器協商可以設置的頭部信息，可以允許的HTTP協議等等信息。
即雖用POST，會先用OPTIONS詢問是否可使用OPTIONS，
故需在 OPTIONS 的 header 加上相關資訊，
解法可參考:https://tomcat.apache.org/tomcat-8.0-doc/config/filter.html#CORS_Filter/Introduction

<filter>
  <filter-name>CorsFilter</filter-name>
  <filter-class>org.apache.catalina.filters.CorsFilter</filter-class>
  <init-param>
    <param-name>cors.allowed.origins</param-name>
    <param-value>*</param-value>
  </init-param>
  <init-param>
    <param-name>cors.allowed.methods</param-name>
    <param-value>GET,POST,HEAD,OPTIONS,PUT</param-value>
  </init-param>
  <init-param>
    <param-name>cors.allowed.headers</param-name>
    <param-value>Content-Type,X-Requested-With,accept,Origin,Access-Control-Request-Method,Access-Control-Request-Headers</param-value>
  </init-param>
  <init-param>
    <param-name>cors.exposed.headers</param-name>
    <param-value>Access-Control-Allow-Origin,Access-Control-Allow-Credentials</param-value>
  </init-param>
  <init-param>
    <param-name>cors.support.credentials</param-name>
    <param-value>true</param-value>
  </init-param>
  <init-param>
    <param-name>cors.preflight.maxage</param-name>
    <param-value>10</param-value>
  </init-param>
</filter>
<filter-mapping>
  <filter-name>CorsFilter</filter-name>
  <url-pattern>/*</url-pattern>
</filter-mapping>

二、IIS的解法
於Web.config設定


<system.webServer>
    ...
    <!-- No 'Access-Control-Allow-Origin' header is present on the requested resource.  -->
    <httpProtocol>
      <customHeaders>
        <add name="Access-Control-Allow-Origin" value="*" />
        <add name="Access-Control-Allow-Headers" value="Content-Type" />
        <add name="Access-Control-Allow-Methods" value="GET, POST, PUT, DELETE, OPTIONS" />
      </customHeaders>
    </httpProtocol>
  </system.webServer>
發表於 程式分享

ionic 2 切換不同選單

發表於 由Grace撰寫

1.先設定 2 個 ion-menu tag，分別有不同id
且openMenu分別傳送不同值
Ex.
1.PNG

2.ts檔內的openMenu function可接收不同值做判斷
Ex.

import { IonicPage, NavController, MenuController, Platform } from 'ionic-angular';

...

@IonicPage()
@Component({
  selector: 'page-test',
  templateUrl: 'test.html'
})
export class TabsPage {
  constructor(public menuCtrl: MenuController) {
  }

  openMenu(menuId : int) {
    console.log('in openMenu');
    if (menuId == 2) {
        this.menuCtrl.enable(false, 'menu1');
        this.menuCtrl.enable(true, 'menu2');
    } else {
        this.menuCtrl.enable(true, 'menu1');
        this.menuCtrl.enable(false, 'menu2');
    }
    
    this.menuCtrl.open();
  }  
}
發表於 程式分享

ionic 2設置app圖標和啟動動畫

發表於 由Grace撰寫

原以為產生app圖標及啟動動畫之圖檔需要由美工產生
1.PNG

發現ionic有好用的工具，
只需先於resources下 放置 icon.png 及 splash.png (像素請用2732 * 2048以上)
2

cd至專案目錄再執行ionic resources即會自動產生
1.PNG

註: 若未產生ios或android對應圖檔，
請記得於專案目錄先執行
ionic platform add ios 及 ionic platform add android