import { Component, ViewChild, ElementRef } from '@angular/core';

import { ConferenceData } from '../../providers/conference-data';
import { Dialogs } from 'ionic-native';
import { Platform } from 'ionic-angular';
import { Plus } from '../../providers/plus';


@Component({
  selector: 'page-map',
  templateUrl: 'map.html'
})
export class MapPage {
    plus: any;
    @ViewChild('mapCanvas') mapElement: ElementRef;/*通过模版变量注入，但类型是元素类型*/
    constructor(public confData: ConferenceData, public platform: Platform, plus: Plus) {
        this.platform.ready().then((readySource) => {
            this.plus = plus.plus;
      // Platform now ready, execute any required native code
    });
  }
    mapEle: any;
  ionViewDidLoad() {
      //this.baidumap();
      this.confData.getMap().subscribe(mapData => {
          this.mapEle = this.mapElement.nativeElement;//*拿到原生dom元素，然后，开始干活*/
          this.locate();    
      });

    }
  map: any;
  locate() {
      //let wo = ws.opener();
      //高德地图坐标为(116.3974357341,39.9085574220), 百度地图坐标为(116.3975,39.9074)
      let pcenter = new this.plus.maps.Point(116.3975, 39.9074);
      setTimeout(() => {
          this.map = new this.plus.maps.Map(this.mapEle.id);
          this.map.centerAndZoom(pcenter, 12);
          this.createMarker();
          // 创建子窗口
          //this.createSubview();
      }, 1000);
  }
     createMarker() {
              //高德地图坐标为(116.3406445236,39.9630878208), 百度地图坐标为(116.347292,39.968716
         let marker = new this.plus.maps.Marker(new this.plus.maps.Point(116.347292, 39.968716));
              //marker.setIcon("/logo.png");
         marker.setLabel("HBuilder");
         var bubble = new this.plus.maps.Bubble("打造最好的HTML5移动开发工具");
              marker.setBubble(bubble);
              this.map.addOverlay(marker);
          }
 //createSubview() {
 //    // 创建加载内容窗口
 //             let topoffset: string = '44px';
 //             if (plus.plus.navigator.isImmersedStatusbar()) {// 兼容immersed状态栏模式
 //                 topoffset = (Math.round(plus.plus.navigator.getStatusbarHeight()) + 44) + 'px';
 //             }
 //             var wsub = plus.plus.webview.create('maps_map_sub.html', 'sub', { top: topoffset, height: '60px', position: 'absolute', scrollIndicator: 'none', background: 'transparent' });
 //             plus.plus.webview.currentWebview().append(wsub);
 //         }
}

import { Injectable } from '@angular/core';

declare var window: any;

@Injectable()
export class Plus {

plus: any;
constructor() {
    **this.plus = window.plus == undefined ? null : window.plus;**

}

/**
 * 消息提醒
 * @param msg 消息
 */
toast(msg) {
    **if (this.plus)** {
        this.plus.nativeUI.toast(msg, { duration: "long" });
    } else
    {
        alert(msg)
    }
}

}

ionic2的模板，默认会被全部打包到www\build\main.js里，导致单文件过大。且无法实现按用户切换不同的模板。
默认Component装饰器写法

@Component(
{
    templateUrl: 'tabs.html'
})

- 阅读剩余部分 -

第一种不存入数据库，临时运算

[DisplayName("字段")]
public double CoalNum; 

private double _SO2; 
[DisplayName("SO2")，NonPersistent]
public double SO2 {
    get { return _SO2; }
    set {
        _SO2 = (CoalNum * 0.012 * 0.8 * 2);
    }
}

第二种字段存入数据库；但是运算过后数据会延迟存入数据库

[DisplayName("字段")]
public double CoalNum; 

private double _SO2; 
[DisplayName("SO2")]

public double SO2 {
    get { return _SO2 = (CoalNum * 0.012 * 0.8 * 2); }  
}

第三种都同时存入数据库

[DisplayName("字段")]
public double CoalNum; 

[DisplayName("SO2")]
public double SO2; 

protected override void OnSaving(){
    SO2 = (CoalNum * 0.012 * 0.8 * 2);
}

4.继承
sass中，选择器继承可以让选择器继承另一个选择器的所有样式，并联合声明。使用选择器的继承，要使用关键词@extend，后面紧跟需要继承的选择器。

//sass style
//-------------------------------
h1{
  border: 4px solid #ff9aa9;
}
.speaker{
      @extend h1;
      border-width: 2px;
}

//css style
//-------------------------------
h1,.speaker{
      border: 4px solid #ff9aa9;
}
.speaker{
      border-width: 2px;
}