要解决Angular 5中基本计时器对象在UI中没有更新的问题，您可以尝试以下解决方法：

1. 使用ChangeDetectorRef手动更新UI：

   • 在组件的构造函数中注入ChangeDetectorRef：

     constructor(private cdr: ChangeDetectorRef) { }
     

   • 在计时器对象的值发生变化时，调用markForCheck方法来手动更新UI：

     this.timer = setInterval(() => {
       // 更新计时器对象的值
       this.timerObject.value = new Date();
       // 手动更新UI
       this.cdr.markForCheck();
     }, 1000);
     

2. 使用zone.js库来自动更新UI：

   • 首先，确保您已经安装了zone.js库。如果没有，请运行以下命令进行安装：

     npm install zone.js --save
     

   • 在您的main.ts文件中引入zone.js：

     import 'zone.js/dist/zone';
     

   • 在组件中，将计时器对象的值更新封装在NgZone.run()方法中：

     import { NgZone } from '@angular/core';
     
     constructor(private ngZone: NgZone) { }
     
     startTimer() {
       this.ngZone.run(() => {
         this.timer = setInterval(() => {
           // 更新计时器对象的值
           this.timerObject.value = new Date();
         }, 1000);
       });
     }
     

3. 使用Observable来更新UI：

   • 在组件的构造函数中注入ChangeDetectorRef和Observable：

     import { ChangeDetectorRef } from '@angular/core';
     import { Observable, interval } from 'rxjs';
     
     constructor(private cdr: ChangeDetectorRef) { }
     

   • 使用interval创建一个Observable来更新计时器对象的值，并在订阅时手动更新UI：

     timer$: Observable;
     
     startTimer() {
       this.timer$ = interval(1000);
       this.timer$.subscribe(() => {
         // 更新计时器对象的值
         this.timerObject.value = new Date();
         // 手动更新UI
         this.cdr.detectChanges();
       });
     }
     

这些解决方法中的任何一种都可以帮助您在Angular 5中更新基本计时器对象的UI。根据您的具体需求，选择适合您的解决方法。