0

Angular (1.4.x) では、$modelValue を変更せずに入力コンテキストを動的に変更する方法はありますか? たとえば、$modelValue を変更せずに、ローカル/UTC の時間 (瞬間) 入力テキスト/コンテンツを動的に切り替えることは可能ですか? ビューとモデルの両方の値を変更する例を次に示します。モデル値ではなく、入力コンテキストをマスクするだけです。

ありがとう!

var app = angular.module('testparser', []);

app.controller('MainCtrl', function($scope) {
  $scope.data = {
    name: ''
  };
});
app.directive('changetime', function() {
  return {
    restrict: 'EA',
    require: 'ngModel',
    link: function(scope, element, attrs, ngModel) {
      //format text going to user (model to view)
      ngModel.$formatters.push(function(value) {
        return value;
      });

      //format text from the user (view to model)
      ngModel.$parsers.push(function(value) {
        return value;
      });

      scope.data.time = moment().format('HH:mm:ss')
      scope.setLocalTime = function() {
        scope.data.time = moment().local().format('HH:mm:ss');
      }
      scope.setUtcTime = function() {
        scope.data.time = moment().utc().format('HH:mm:ss');
      }
    }
  }
});
<html ng-app="testparser">

<head>
  <meta charset="utf-8" />
  <script data-require="angular.js@1.4.8" data-semver="1.4.8" src="https://code.angularjs.org/1.4.8/angular.js"></script>
  <script data-require="moment.js@*" data-semver="2.10.2" src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.10.2/moment.min.js"></script>


</head>

<body ng-controller="MainCtrl">
  <input type="button" value="set to local" ng-click="setLocalTime()" />
  <input type="button" value="set to utc" ng-click="setUtcTime()" />
  <input changetime ng-model="data.time" />
  <pre>model is: {{data.time}}</pre>
</body>

</html>

4

1 に答える 1

1

あなたは本当に近かった。

var app = angular.module('testparser', []);

app.controller('MainCtrl', function($scope) {
  $scope.data = {
    name: ''
  };
});

app.directive('changetime', function() {
return {
    restrict: 'EA',
    require: 'ngModel',
    link: function(scope, element, attrs, ngModel) {
  //format text going to user (model to view)
  ngModel.$formatters.unshift(function(value) {
    return value;
  });

  //format text from the user (view to model)
  ngModel.$parsers.unshift(function(value) {
    return value;
  });

  scope.data.time = moment().format('HH:mm:ss')

  scope.setLocalTime = function() {
    ngModel.$viewValue = moment().local().format('HH:mm:ss');
    ngModel.$render();
    //scope.data.time = moment().local().format('HH:mm:ss');
}
scope.setUtcTime = function() {
    ngModel.$viewValue = moment().utc().format('HH:mm:ss');
    ngModel.$render();
    //scope.data.time = moment().utc().format('HH:mm:ss');
}
}
}
});
于 2016-03-24T09:43:30.733 に答える