AngularJS表单的日期与浏览器的时区不同

Question

我有预约约会的表格：

<form>
  <div>
    <label>Date:</label>
    <input type="date" ng-model="scheduled" />
  </div>
  <div>
    <label>Time:</label>
    <input type="time" ng-model="scheduled" />
  </div>
  <div>
    Summary: {{scheduled}}
  </div>
</form>

此表单似乎自动作用于浏览器的时区。例如，如果我将日期和时间分别设置为 2016-03-03 和 12:00 AM ，则约会的预定设置为 2016-03-03T08 ：00：00.000Z （当系统时钟在PST时）。

我现在有兴趣修改表单以允许设置任意时区（基于办公室 - 但为了简单起见，下拉列表将起作用）：

<form>
  <div>
    <label>TZ:</label>
    <select ng-model="tz">
      <option value="pst">PST</option>
      <option value="est">EST</option>
    </select>
  </div>
  ...
  <div>
    Summary: {{scheduled | date : 'medium' : tz}} {{tz}}
  </div>
</form>

这会将显示更改为所选时区，但不会更改输入。如何根据选项更改表单的时区？