angularjs – 在Angular中动态设置ngModelOptions

发布时间：2020-12-17 07:14:35 所属栏目：安全来源：网络整理

导读：我有以下片段： input type="date" ng-model="arrival" ng-model-options="{timezone: 'PST'}" /input type="time" ng-model="arrival" ng-model-options="{timezone: 'PST'}" /{{arrival}} 这工作正常(日期显示在从PST转换的UTC时间).我现在正试图让’PST’

我有以下片段：

<input type="date" ng-model="arrival" ng-model-options="{timezone: 'PST'}" />
<input type="time" ng-model="arrival" ng-model-options="{timezone: 'PST'}" />
{{arrival}}

这工作正常(日期显示在从PST转换的UTC时间).我现在正试图让’PST’选项动态化：

<select ng-model="timezone>
  <option value="PST">PST</option>
  <option value="EST">EST</option>
</select>
<input type="date" ng-model="arrival" ng-model-options="{timezone: timezone}" />
<input type="time" ng-model="arrival" ng-model-options="{timezone: timezone}" />
{{arrival}}

但是,更改时区永远不会更新到达(似乎绑定不适用于nd-model-options).任何方式我可以在时区更改时强制字段刷新？

编辑

小提琴：https://jsfiddle.net/10nfqow9/

解决方法

创建另一个具有高优先级(高于ng-model / ng-model-option)的指令(属性类型),该指令监视options对象的更改并触发重新编译.我对缺乏具体细节表示歉意,我正在打电话:)

编辑：
看起来有一个名为kcd-recompile的指令完全符合我的描述.这是一个工作plnkr,还有一些额外的好东西可以用于美国时区的DST.

HTML：

<div kcd-recompile="data.timezone">
  <div>
    <select ng-model="data.timezone" ng-options="x.offset as x.name for x in timezones">
    </select>
  </div>
  <div>
    <input type="date" ng-model="data.arrival" ng-model-options="{timezone: data.timezone}" />
  </div>
  <div>
    <input type="time" ng-model="data.arrival" ng-model-options="{timezone: data.timezone}" />  
  </div>
</div>

和JS：

Date.prototype.stdTimezoneOffset = function() {
    var jan = new Date(this.getFullYear(),1);
    var jul = new Date(this.getFullYear(),6,1);
    return Math.max(jan.getTimezoneOffset(),jul.getTimezoneOffset());
}

Date.prototype.dst = function() {
    return this.getTimezoneOffset() < this.stdTimezoneOffset();
}

angular.module('DemoApp',['kcd.directives']);
angular.module('DemoApp')
.controller('DemoCtrl',['$scope',function($scope) {
    var now = new Date(),isDst = now.dst();

    $scope.data ={
      arrival: now,timezone: null
    };
    $scope.timezones = [
      {
        name: 'PST',offset: isDst ? '-0700' : '-0800'
      },{
        name: 'EST',offset: isDst ? '-0400' : '-0500'
      }
    ];
  }]
);

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!