Angular4错误提示的说明(一)

2019独角兽企业重金招聘Python工程师标准>>> hot3.png

错误一:

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。这个错误会在开发模式下的测试时产生,开发模式要求数据模型是稳定的,如果在单个变化检测过程中发生了数据变化就会抛出这个异常。请看下面的代码:

  
  

如果一开始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> {
        let lb = MANUFACTURERS_BODY as ListBody;
    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();

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

转载于:https://my.oschina.net/jianglibo/blog/1574261

你可能感兴趣的:(Angular4错误提示的说明(一))