Question

我在数据库中将我的小时字段存储在几分钟内，因此我需要将值更改为以小时显示。

我还没有代码。

我想在某些替代方案中，我想知道是否有人试过了一些：

1ª我将指令作为属性并将值作为指令的属性传递，使用值执行我需要的操作，然后将最终值（如15:59）放入元素。

2ª我也会做一个指令，但是这个指令将是一个自我控制的元素，当用户输入一个值时，我会转换为分钟，但在视图中会保持用户输入值。

有什么更好的方式？

Answer 1

归结为您是否需要用户输入。如果你必须使用2路指令，如下所示。

在角度指令链接功能中，您有4个参数：

function (scope, element, attrs, controller)

controller参数允许您操作指令的ng-model。最重要的是，控制器有一些叫做$ formatters和$ parsers的东西。这些$ formatters和$ parsers允许你完成你正在尝试的东西，因为它允许你操作模型和视图值作为你的指令的一部分。

https://docs.angularjs.org/api/ng/type/ngModel.NgModelController#$parsers

Formatters将允许您设置在视图中查看模型的方式（初始加载）解析器将允许您设置视图保存到模型的方式（用户输入）

这可以按如下方式完成：

directive code
....
link: function (scope, element, attrs, controller) {
   function hoursToMinutes(viewValue){
     viewValue = ...Conversion logic...
     controller.$viewValue = viewValue;
     return viewValue;
   }
   function minutesToHours(modelValue){
     modelValue= ...Conversion logic...
     controller.$modelValue= modelValue;
     return modelValue;
   }
   controller.$parsers.push(hoursToMinutes);
   controller.$formatters.push(minutesToHours);
}
....

Answer 2

创建过滤器

app.filter('minutesToHourFormatFilter', function() {
      return function(input) {
      var b = input / 60;
      var hours = b.toFixed(0);
      var c = (b - hours) * 60;
      var minutes = Math.ceil(c)
      return hours + "h " + minutes + "m"
      }
    });

然后在你的模板中你可以做到：

{{ minutes | minutesToHourFormatFilter}}

更改视图值而不更改模型值

2 个答案: