Angular 角度抛出表达式ChangedTerrithasBeenCheckedError与textarea

当我单击列表下的一个项目并转到详细信息页面时，它会抛出ExpressionChangedTerithasBeenCheckedError和DebugContext

我能够把我原来的项目剥离出来，然后复制错误。 该错误仅在Textarea中发生。如果我用输入替换Textarea，就可以了

请参阅第3条评论，以获取链接和live示例的详细信息

import { Component, Input, OnInit, OnDestroy } from '@angular/core';
import { Router, ActivatedRoute, Params } from '@angular/router';
import { BeginEventEmitter, EndEventEmitter } from './emitter';
import { SelectSourceService } from "./sourceselect.service";

import { CodeService } from "./codes.service";
import { Code } from "./code"

@Component(
    {
        selector: 'Detail',
        template: `    <h3>Details</h3>
    <form>
      <div class="form-group">
        <label for="id">ID</label>
        <input type="text" class="form-control" id="id" name="id" [(ngModel)]="theCode.id">
      </div>
      <div class="form-group">
        <label for="description">description</label>
        <textarea class="form-control" id="description" name ="description" rows=10 cols=30 [(ngModel)]="theCode.description"></textarea>
      </div>
      <button type="button" class="btn btn-default" (click)="OnFormSubmit()">Submit</button>
    </form>`
    })
export class DetailsComponent implements OnInit, OnDestroy  {

    theCode: Code;
    id: string;
    showLoader: boolean = true;
    source : string;

    setDetail(): void {
        this.theCode = this.codeService.getCode4Id(this.source, this.id);
    }

    constructor(private codeService: CodeService, private route: ActivatedRoute, private router: Router, 
        private _selSourceService: SelectSourceService, private opening:BeginEventEmitter, private closing:EndEventEmitter) {

    }

    ngOnInit()
    {
        this.route.params
            .subscribe(value => this.id = value['id']);
        this.subscription = this._selSourceService.sourceSelection$.subscribe((selection: string) => { this.source = selection; this.setDetail(); });
        this.opening.emit("Opening Details for " + this.id);
    }

    ngOnDestroy() {
        this.closing.emit("Closing Details for " + this.id);
    }

    OnFormSubmit(data: Code): void {
        alert("The Changes were submitted");
        this.router.navigate(['/Codes']);
    }

    OnFormCancel() : void {
        alert("The form was cancelled");
    }
};    

从'@angular/core'导入{Component，Input，OnInit，OnDestroy}；
从'@angular/Router'导入{Router，ActivatedRoute，Params}；
从“./emitter”导入{BeginEventMitter，EndEventMitter}；
从“/sourceselect.service”导入{SelectSourceService}；
从“/codes.service”导入{CodeService}；
从“/Code”导入{Code}
@组成部分(
{
选择器：“详细信息”，
模板：`详细资料
身份证件
描述
提交
`
})
导出类详细信息组件实现OnInit、OnDestroy{
代码：代码；
id：字符串；
showLoader:boolean=true；
资料来源：字符串；
setDetail（）：void{
this.theCode=this.codeService.getCode4Id（this.source，this.id）；
}
构造函数（专用代码服务：代码服务，专用路由：ActivatedRoute，专用路由器：路由器，
private _selSourceService:SelectSourceService，private opening:beginEventMitter，private closing:endEventMitter）{
}
恩戈尼尼特（）
{
这个.route.params
.subscribe（value=>this.id=value['id']）；
this.subscription=this.\u selSourceService.sourceSelection$.subscripte（（selection:string）=>{this.source=selection；this.setDetail（）；}）；
this.opening.emit（“+this.id”的打开细节）；
}
恩贡德斯特罗（）{
this.closing.emit（“+this.id”的关闭详细信息）；
}
OnFormSubmit（数据：代码）：无效{
警报（“变更已提交”）；
this.router.navigate（['/Codes']）；
}
OnFormCancel（）：void{
警告（“表格被取消”）；
}
};    

打开你的

应用程序

组件，然后找到

ngOnInit

挂钩并尝试更换

this.openDetails.subscribe(() => { this.detailOpen++; })

与

---

谢谢。为什么会这样？我也对我的原始项目做了同样的更改，但没有任何帮助，因为它是在下一个视图检查中执行的。你能给我看一下它不起作用的地方吗？这里是部署的站点。使用Test1@a.com和Test1@a.com登录。单击其中一个项目的详细信息，向下滚动并点击保存。你会注意到1。错误2。成功警报后，它无法加载列表。3.下拉列表应该在返回列表页面时启用，但它仍然处于禁用状态。我需要一个简单的示例。我无法访问您的网站

此网站已被网络管理员阻止

我只是使用此链接从chrome和IE登录，并能够使用上述信息登录并进入实践。请您再试一次，告诉我您在什么时候出错。感谢这篇文章非常详细地解释了这种行为

this.openDetails.subscribe(() => Promise.resolve(null).then(() => this.detailOpen++));