从角度日期选择器传递日期到Java后端的理想方法?

时间:2018-12-20 14:21:35

标签: java angular spring-boot

我正在使用一个简单的todo应用程序来学习angular的基础知识。我有一个简单的spring boot后端,可以正常工作。我目前正在努力将日期从角度引导日期选择器传递到后端的最佳方法。由于现在的代码是数据类型不匹配。

将其转换为秒数并将其转换回后端的java日期是一种理想的方法吗?

我的待办事项实体:

@Id
    @GeneratedValue
    private long id;
    private @NonNull
    String taskName;
    private Date dueDate;
    private String extraNote;
    private boolean taskCompleted;

当他创建新的待办事项时,我在哪里得到用户输入:

@Input() toDoData = { taskName: '', taskCompleted: false, extraNote: '', dueDate: Date};

  addToDo() {
    this.todoService.addToDo(this.toDoData).subscribe((result) => {
      this.todoService.addToDo(this.toDoData);
    });
  }

添加我的todoService的todo部分:

addToDo(todo): Observable<any> {
        console.log(todo);
        return this.http.post<any>(this.API + 'todos', JSON.stringify(todo), this.httpOptions).pipe(
            tap((todo) => console.log(`added todo w/ id=${todo.id}`)),
            catchError(this.handleError<any>('addTodo'))
        );
    }

感谢您的帮助!

编辑(已添加ToDoController):

@RestController
public class ToDoController {
    private ToDoRepository repository;

    public ToDoController(ToDoRepository repository) {
        this.repository = repository;
    }

    @GetMapping("/todos")
    List<ToDo> all() {
        return repository.findAll();
    }

    @PostMapping("/todos")
    ToDo newToDo(@RequestBody ToDo newToDo) {
        return repository.save(newToDo);
    }

    @GetMapping("/todos/{id}")
    ToDo one(@PathVariable Long id) {
        return repository.findById(id)
                .orElseThrow(() -> new ToDoNotFoundException(id));
    }

    @PutMapping("/todos/{id}")
    ToDo replaceToDo(@RequestBody ToDo newToDo, @PathVariable Long id) {

        return repository.findById(id)
                .map(toDo -> {
                    toDo.setTaskName(newToDo.getTaskName());
                    toDo.setDueDate(newToDo.getDueDate());
                    toDo.setExtraNote(newToDo.getExtraNote());
                    toDo.setTaskCompleted(newToDo.getTaskCompleted());
                    return repository.save(toDo);
                })
                .orElseGet(() -> {
                    newToDo.setId(id);
                    return repository.save(newToDo);
                });
    }

    @DeleteMapping("/todos/{id}")
    void deleteToDo(@PathVariable Long id) {
        repository.deleteById(id);
    }

    @GetMapping("/deleteall")
    @CrossOrigin(origins = "http://localhost:4200")
    public void deleteAll() {
        repository.deleteAll();
    }

    @GetMapping("/init")
    @CrossOrigin(origins = "http://localhots:4200")
    public void createDefaults() {
        Date date = new Date();
        repository.save(new ToDo("PMB", date, false));
        repository.save(new ToDo("GMDU", date, false));
        repository.save(new ToDo("INMA", date, true));
        repository.save(new ToDo("SLGP", date, false));
    }
}

2 个答案:

答案 0 :(得分:2)

首先。使用日期时,应考虑夏季/冬季时间问题,因此,我建议使用LocalDate(Time)类。

说: 我会创建一个

@Configuration
public class JacksonConfig {

    @Bean
    @Primary
    public ObjectMapper serializingObjectMapper() {
        ObjectMapper objectMapper = new ObjectMapper();

        // Mirror the default Spring Boot Jackson settings
        objectMapper.configure(MapperFeature.DEFAULT_VIEW_INCLUSION, false);
        objectMapper.configure(DeserializationFeature.FAIL_ON_UNKNOWN_PROPERTIES, false);

        JavaTimeModule javaTimeModule = new JavaTimeModule();
        javaTimeModule.addSerializer(LocalDateTime.class, new LocalDateSerializer());
        javaTimeModule.addDeserializer(LocalDateTime.class, new LocalDateDeserializer());
        objectMapper.registerModule(javaTimeModule);
        return objectMapper;
    }

    public static class LocalDateSerializer extends JsonSerializer<LocalDateTime> {
        @Override
        public void serialize(LocalDateTime value, JsonGenerator gen, SerializerProvider serializers) throws IOException {
            gen.writeNumber(value.atZone(ZoneId.systemDefault()).toInstant().toEpochMilli());
        }
    }
    public static class LocalDateDeserializer extends JsonDeserializer<LocalDateTime> {
        @Override
        public LocalDateTime deserialize(JsonParser p, DeserializationContext ctxt) throws IOException {
            return LocalDateTime.ofInstant(Instant.ofEpochMilli(p.getValueAsLong()), ZoneId.systemDefault());
        }
    }
}

将所有日期/时间等转换为毫秒,然后将毫秒转换回localDate(Time)。您可以在互联网上找到很多示例。

这充当通过应用程序中端点的所有日期/时间的筛选器。 这样一来,您无需再担心任何转换问题。

然后,您将需要在Angular中实现dateToMillisecond,反之亦然,并在需要转换日期的地方使用它。您可以拦截http流量并执行相同的操作,但是实现起来可能会有些复杂。

样本

function timeFromMillis(millis) {
    if (_.isEmpty(millis)) {
        return undefined;
    }
    const momentTimeStamp = moment.unix(millis / 1000);
    if (!momentTimeStamp.isValid()) {
        return undefined;
    }
    return momentTimeStamp.toDate();
}

function timeToMillis(obj) {
    if (!_.isEmpty(obj)) {
        if (obj instanceof moment) {
            return obj.valueOf();
        } else if (obj instanceof Date) {
            return obj.getTime();
           else if (angular.isString(obj)) {
            return parseDateString(obj).getTime();
        } else {
           return angular.undefined;
        }
    }
}

function parseDateString(dateString) {
    if (angular.isDefined(dateString) && dateString) {
        return moment(dateString, 'YYYY-MM-DD').toDate();
    }
}

答案 1 :(得分:0)

您有2个使用timeStamp的选项,只要从角度到结束以及从后面到角度都长时间粘贴,这就是我喜欢的方式,因为时间戳是唯一的 或者,您可以使用自定义序列化器反序列化器

public class CustomDateTimeSerializer extends StdSerializer<DateTime> {

private static DateTimeFormatter formatter =
        DateTimeFormat.forPattern("yyyy-MM-dd HH:mm");

public CustomDateTimeSerializer() {
    this(null);
}

protected CustomDateTimeSerializer(Class<DateTime> t) {
    super(t);
}

@Override
public void serialize(DateTime value, JsonGenerator gen, SerializerProvider serializerProvider) throws IOException {
    gen.writeString(formatter.print(value));
}


public class CustomDateTimeDeserializer extends JsonDeserializer<DateTime> {

@Override
public DateTime deserialize(JsonParser jsonParser, DeserializationContext deserializationContext) throws IOException, JsonProcessingException {
    DateTimeFormatter formatter = DateTimeFormat.forPattern("yyyy-MM-dd HH:mm");
    DateTime dateTime = formatter.parseDateTime(jsonParser.getText());
    return dateTime;
}
}

ps:我在串行器和解串器中使用了yoda时间