Apache Cordova 使用本地 API

使用本地API

在本部分中，我增加了給員工添加他/她的位置信息標簽的能力。在本示例應用程序中，我們在一個警告中顯示原始信息（經度/緯度）。在現實生活中的應用程序中，我們通常在數據庫中保存位置信息作為員工信息的一部分，并在一張圖上顯示。

當將應用程序作為一個Cordova 應用程序在你的設備上運行時，下面的這些代碼就會工作。當頁面是由http:// 協議服務時，這些代碼也會在桌面系統(tǒng)中的Chrome上工作，并且在Firefox中，忽視該協議（http:// 或 file://）。

步驟

1、增加geolocaton插件到你的項目中：

cordova plugin add org.apache.cordova.geolocation

2、在index.html中，增加以下列表項到employee-tpl模板：

<li class="table-view-cell media">
  <a hre="#" class="push-right add-location-btn">
      <span class="media-object pull-left"></span>
      <div class="media-body">
          Add location
      </div>
  </a>
</li>

3、在EmployeeView的initialize()函數中，為Add Location列表項的單擊事件注冊一個事件偵聽器。

this.$el.on('click', '.add-location-btn', this.addLocation);

確保你增加的這一行是作為initialize()函數的最后一行（在this.$el被分配以后）。

4、在EmployeeView中，定義addLocation 事件處理程序如下：

this.addLocation = function(event) {
  event.preventDefault();
  navigator.geolocation.getCurrentPosition(
      function(position) {
          alert(position.coords.latitude + ',' + position.coords.longitude);
      },
      function() {
          alert('Error getting location');
      });
  return false;
};

5、測試應用程序。