我是Angle 2+的新手，并且继承了一个不完整的项目。我的目标是创建一个工具提示，以检查特定字段上的审核详细信息并显示它们。一个示例可能是：
"Updated by Seth, on 8/18/18."
为此，我创建了一个角组件，该组件通过服务将所有相关信息传递回去。通过在Web调试器中查看，我可以看到该服务调用正在按预期方式工作。不幸的是，呈现的是带有以下不完整文本的工具提示：
"updated by , "
这是我的组件模板。
<ng-template #tipContent>
<span *ngIf="loadCompleted">Updated By {{ auditDetail.updatedBy }}, {{ auditDetail.updatedAt | amTimeAgo }}</span>
</ng-template>
<i [ngbTooltip]="tipContent" (mouseenter)="refreshAuditDetail()" class="fas fa-info-circle fa-sm"></i>
这是组件打字稿。
@Component({
selector: 'audit-tooltip',
templateUrl: './audit-tooltip.component.html',
styleUrls: ['./audit-tooltip.component.css']
})
export class AuditTooltipComponent {
@Input() plan: Plan;
@Input() fieldName: string;
auditDetail: AuditDetail;
loadCompleted: boolean = false;
constructor(private planService: PlanService) { }
refreshAuditDetail() {
var planId = this.plan.id;
var fieldName = this.fieldName;
var fieldValue = this.plan[this.fieldName];
this.loadCompleted = false;
this.planService.getAuditDetails(planId, fieldName, fieldValue)
.subscribe((auditDetail: AuditDetail) => {
console.log(auditDetail);
this.auditDetail = auditDetail;
}, () => {}, () => this.loadCompleted = true);
}
}
而且，如有必要，这是我正在使用它的地方。
<h5 class="card-title">{{fieldLabel}}<audit-tooltip [fieldName]="fieldName" [plan]="plan"></audit-tooltip> </h5>
我想念什么？
不幸的是-答案与时间无关。发布前，我忽略了50倍的套管问题。在尝试实施我收到的建议时，我终于注意到了问题。
HttpResponse正在返回
{{ U pdatedBy：XX，U pdatedAt：YY}），而AuditDetail具有u pdatedBy和u pdatedAt作为属性。它没有映射，这使它看起来像我认为是时间问题。
本文收集自互联网，转载请注明来源。
如有侵权，请联系[email protected] 删除。
我来说两句