Angular4错误提示的说明（一）

错误一：

Uncaught NetworkError: Failed to execute 'send' on 'XMLHttpRequest': Failed to load 'ng:///DynamicTestModule/Manufactu
rerListComponent.ngfactory.js'.

这个错误很可能是一个误导，你可能根本没有用到XMLHttpRequest。添加测试命令的参数，可以发现真正的导致错误的原因。

ng test --sourcemaps=false
或者
npm test --sourcemaps=false
或者
yarn test --sourcemaps=false

此时错误变成了：

Error: ExpressionChangedAfterItHasBeenCheckedError: Expression has changed after it was checked. Previous value:
 '0'. Current value: '12'.

这个错误名称有点长，ExpressionChangedAfterItHasBeenCheckedError。这个错误会在开发模式下的测试时产生，开发模式要求数据模型是稳定的，如果在单个变化检测过程中发生了数据变化就会抛出这个异常。请看下面的代码：

<mat-paginator #paginator
                [length]="dataSource.resultsLength"
                [pageIndex]="0"
                [pageSize]="5"
                [pageSizeOptions]="[5,10,25,100]">
  </mat-paginator>

如果一开始datasource.resultsLength等于0，等到datasource从后端获取数据将这个值修改成12，就会抛出这个错误。从逻辑上来说，实际运行的系统就是这样，没有什么错误，在product模式下也不会出错。但是在dev模式下就会出错，所以在测试代码中一开始就将datasource.resultsLength设置成12，然后获取数据之后也是12，就可以消除这个错误。

class HttpDatastoreServiceStub {
  findAll(jsonapiObjectType: Manufacturer,page: PageCursor | PageOffsetLimit | PageNumberSize,sort: SortPhrase[],filter: FilterPhrase[],params?: any): Observable<ListBody<ManufacturerAttributes,Manufacturer>> {
        let lb = MANUFACTURERS_BODY as ListBody<ManufacturerAttributes,Manufacturer>;
    console.log(page);
    if (isPageOffsetLimit(page)) {
      lb.data = lb.data.slice(page.offset,page.limit + page.offset);
    }
    return Observable.of(lb);
  }
}

@Injectable()
class ManufacturerServiceMock {
    constructor(private _datastore: HttpDatastore) {
    }
     getDatasource(): ManufacturerDatasource {
       let mfds = new ManufacturerDatasource(this._datastore);
       mfds.resultsLength = 12;
       return mfds;
     }
  }
let httpDatastoreServiceStub = new HttpDatastoreServiceStub();

从测试的目的来说，也确实只需验证单个数据模型对应的视图即可。

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!