Question

我在Angular 2应用程序中使用Angular的日期管道，以便以更人性化的格式格式化日期。我可以从API中提取日期，并成功编辑并将这些日期保存到API。但是，我遇到的问题是日期管道错误地改变了日期 - 就实际显示的内容而言。

澄清一下，如果我将原始日期打印到屏幕上，那是正确的。当我编辑通过日期管道传递的值时，将保存正确的日期。但是，在我进行编辑之后，转换后的日期值再次发生变化（不是就保存的内容而言，只是根据视图中显示的内容而言） - 并且最终会稍微关闭，通常是一天左右。因此，如果我将值编辑为09/25/2010，那么将保存到数据库中，但视图中显示的是09/24/2010。因此，对于时区导致问题，可能会出现某种默认情况？

这是我的视图代码的样子（我将首先列出通过日期管道传递的日期值，然后是相同的值，但不会通过日期管道传递），用于dob - 出生日期：

<!-- DATE PASSED THROUGH DATE PIPE -->
    <input class="app-input" [ngModel]="member.dob | date:'MM/dd/yyyy'"
        (ngModelChange)="member.dob=$event" name="inputField" type="text" /> 

<!-- RAW VALUE PRINTED TO SCREEN -->
    <input class="app-input" [ngModel]="member.dob" 
        (ngModelChange)="member.dob=$event" name="inputField" type="text" />

这最终会被打印到上面代码的屏幕上：

所以你会注意到转换后的值已经过了一天。我可以在这里添加什么来确保在通过日期管道后将正确的转换值打印到屏幕上？

Answer 1

问题不在于管道，而是在将其转换为字符串时。这是因为你的时区。我使用下面的方法来获得正确的值：

extension String {

  func indexes(of character: String) -> [Index] {
    precondition(character.count == 1, "character should be single letter string")

    return enumerated().reduce([]) { (partial, component) in

      let currentIndex = index(startIndex,
                               offsetBy: component.offset)
      return String(self[currentIndex]) == character
                                  ? partial + [currentIndex]
                                  : partial
    }
  }

  func capitalizeLetter(after indexes: [Index]) -> String {
    var modifiedString = self

    for currentIndex in indexes {

      guard let letterIndex = index(currentIndex,
                                           offsetBy: 1,
                                           limitedBy: endIndex)
        else { continue }

      let range = letterIndex ... letterIndex

      modifiedString = modifiedString.replacingCharacters(in: range,
                                                          with: self[range].capitalized)
    }

    return modifiedString
  }
}

let string = "an_o_t_h_er_strin_g"
let newString = string.capitalizeLetter(after: string.indexes(of: "_"))
                      .replacingOccurrences(of: "_",with: "")

将日期转换为 d.setMinutes（d.getMinutes（） - d.getTimezoneOffset（））

Answer 2

我认为您应该检查角度的本地时区设置。管道在转换日期时使用它。

Answer 3

打印日期时，它会显示2019-01-17T00:00:00Z

Z-这里表示时区。尝试在执行日期管道之前避免这种情况。

{{ getFormattedDate(originalDate) | date }} 
getFormattedDate(originalDate) {
    return originalDate.toISOString().substring(0, originalDate.toISOString().length - 1);
}

转换原始日期值后角度日期管道打印错误日期

3 个答案: