5

我在 Angular 2 应用程序（测试版 1）中有一个 ComponentB。在我将它放在 ComponentA 的 ngFor 循环中之前，它工作得非常好。我收到了相当神秘的错误：

例外：TypeError：viewFactory_ComponentB0 不是 [ComponentA@1:23 中的数字]BrowserDomAdapter.logError @ angular2.dev.js:22690BrowserDomAdapter.logGroup @ angular2.dev.js:22701ExceptionHandler.call @ angular2.dev.js:1163 中的函数（匿名函数）@ angular2.dev.js:12416NgZone._notifyOnError @ angular2.dev.js:13324collection_1.StringMapWrapper.merge.onError @ angular2.dev.js:13228run @ angular2-polyfills.js:141（匿名函数）@ angular2 .dev.js:13247NgZone.run @ angular2.dev.js:13209(匿名函数) @ angular2.dev.js:12499schedulerFn @ angular2.dev.js:12742tryCatcher @ Rx.js:31Subscriber.next @ Rx.js:9500Subject ._next @ Rx.js:9999Subject.next @ Rx.js:9963EventEmitter.emit @ angular2.dev.js:12723(匿名函数) @ angular2.dev.js:13140run @ angular2-polyfills.js:138NgZone._notifyOnTurnDone @ angular2 .dev.js：13139（匿名函数）@ angular2.dev.js:13254zoneBoundFn @ angular2-polyfills.js:111lib$es6$promise$asap$$flush @ angular2-polyfills.js:1305 angular2.dev.js:22690 原始异常：TypeError： viewFactory_ComponentB0 不是函数BrowserDomAdapter.logError @ angular2.dev.js:22690ExceptionHandler.call @ angular2.dev.js:1172(匿名函数) @ angular2.dev.js:12416NgZone._notifyOnError @ angular2.dev.js:13324collection_1.StringMapWrapper。 merge.onError @ angular2.dev.js:13228run @ angular2-polyfills.js:141（匿名函数）@ angular2.dev.js:13247NgZone.run @ angular2.dev.js:13209（匿名函数）@ angular2.dev。 js:12499schedulerFn@angular2.dev.js:12742tryCatcher@Rx.js:31Subscriber.next@Rx.js:9500Subject._next@Rx.js:9999Subject.next@Rx.js:9963EventEmitter.emit@angular2.dev.js: 12723（匿名函数）@ angular2.dev.js：13140run @ angular2-polyfills.js:138NgZone._notifyOnTurnDone @ angular2.dev.js:13139（匿名函数）@ angular2.dev.js:13254zoneBoundFn @ angular2-polyfills.js:111lib$es6$promise$asap$$$flush @ angular2 -polyfills.js:1305 angular2.dev.js:22690 原始堆栈跟踪：BrowserDomAdapter.logError @ angular2.dev.js:22690ExceptionHandler.call @ angular2.dev.js:1175（匿名函数）@ angular2.dev.js:12416NgZone。 _notifyOnError @ angular2.dev.js:13324collection_1.StringMapWrapper.merge.onError @ angular2.dev.js:13228run @ angular2-polyfills.js:141（匿名函数）@ angular2.dev.js:13247NgZone.run @ angular2.dev。 js:13209(匿名函数)@angular2.dev.js:12499schedulerFn@angular2.dev.js:12742tryCatcher@Rx.js:31Subscriber.next@Rx.js:9500Subject._next@Rx.js:9999Subject.next@Rx。 js:9963EventEmitter.emit @ angular2.dev.js:12723(匿名函数)@angular2.dev.js:13140run@angular2-polyfills.js:138NgZone._notifyOnTurnDone@angular2.dev.js:13139(匿名函数)@angular2.dev.js:13254zoneBoundFn@angular2-polyfills.js: 111lib$es6$promise$asap$$flush @ angular2-polyfills.js:1305 angular2.dev.js:22690 TypeError: viewFactory_ComponentB0 不是 AppViewManager_.createEmbeddedViewInContainer ( angular2.dev.js:9185) 在 ViewContainerRef_.createEmbeddedView (angular2.dev.js:5890) 在 NgFor._bulkInsert (angular2.dev.js:14608) 在 NgFor._applyChanges (angular2.dev.js:14567) 在 NgFor。 ngDoCheck (angular2.dev.js:14552) 在 AbstractChangeDetector.ChangeDetector_ComponentA_0.detectChangesInRecordsInternal (viewFactory_ComponentA:45) 在 AbstractChangeDetector.detectChangesInRecords (angular2.dev.js:7825) 在 AbstractChangeDetector.runDetectChanges (angular2.dev.js:7808) 在 AbstractChangeDetector._detectChangesInViewChildren (angular2.dev.js:7892)

组分A：

@Component({
  selector: 'component-a'
  , directives: [
    FORM_DIRECTIVES
    , ComponentB
  ]
  , template: `
    <!-- works --><component-b [(ngFormControl)]="_formControl"></component-b>
    <!-- fails --><component-b *ngFor="#number of numbers" [(ngFormControl)]="_formControls[number]"></component-b>
  `
})

export class ComponentA {}

任何提示/帮助高度赞赏。

4

2 回答 2

6

正如@TylerDurden 所建议的那样

此错误消息是由循环检测中引入的错误产生的（参见#6404）。

master 中已经有一个修复（参见#6474）尚未发布。这肯定会在 beta.2 中。

建议降级到 beta.0 直到风暴结束。

更新

此问题已在 beta.2 中修复（缩小问题仍然存在）。有关更多详细信息，请参阅更改日志。

于 2016-01-18T03:27:27.610 回答
1

这个问题真的解决了吗？我正在研究“beta 0”，下面的代码对我有用，但是在更新文件时，beta 2 仍然给我带来了与这篇文章相同的问题。这是我的代码：

// rowIterator.component.ts
import {Component,forwardRef} from 'angular2/core';
import {ColumIteratorComponent} from './columIterator.component';
import {ModuleIteratorComponent} from './moduleIterator.component';

@Component({
  selector: '[rowIterator]',
  template: `
    <div *ngFor="#element of rowData">
      <div columIterator *ngIf="element.column" [ngClass]="element.class" [columData]="element.column"></div>

      <div moduleIterator *ngIf="element.module" [ngClass]="element.class" [moduleData]="element.module"></div>
    </div>
    `,
  inputs: ['rowData'],
  directives: [forwardRef(function() { return ColumIteratorComponent; }),ModuleIteratorComponent]
})
export class RowIteratorComponent {
  // "rowData" is a ARRAYS
}

//columnIterator.components.ts
import {Component,forwardRef} from 'angular2/core';
import {RowIteratorComponent} from './rowIterator.component';
import {ModuleIteratorComponent} from './moduleIterator.component';

@Component({
  selector: '[columIterator]',
  template:`
    <div *ngFor="#element of columData">
      <div rowIterator *ngIf="element.row" [ngClass]="element.class" [rowData]="element.row"></div>

      <div moduleIterator *ngIf="element.module" [ngClass]="element.class" [moduleData]="element.module"></div>
    </div>
  `,
  inputs: ['columData'],
  directives: [forwardRef(function(){return RowIteratorComponent;}), ModuleIteratorComponent]
})
export class ColumIteratorComponent{
  // "columData" is a ARRAY
}

我必须在 Beta 0 版本中分别使用forwardRef(function() {return RowIteratorComponent;}函数和forwardRef(function() {return ColumIteratorComponent;})循环并且没有问题，但是在 Versioned beta2 中得到以下错误：

EXCEPTION: TypeError: viewFactory_ColumIteratorComponent0 is not a function in [element.column in RowIteratorComponent@2:25]
EXCEPTION: TypeError: viewFactory_ColumIteratorComponent0 is not a function in [element.column in RowIteratorComponent@2:25]BrowserDomAdapter.logError @ angular2.dev.js:22911BrowserDomAdapter.logGroup @ angular2.dev.js:22922ExceptionHandler.call @ angular2.dev.js:1182(anonymous function) @ angular2.dev.js:12562NgZone._notifyOnError @ angular2.dev.js:13485collection_1.StringMapWrapper.merge.onError @ angular2.dev.js:13389Zone.run @ angular2-polyfills.js:1247(anonymous function) @ angular2.dev.js:13408NgZone.run @ angular2.dev.js:13370(anonymous function) @ angular2.dev.js:12661schedulerFn @ angular2.dev.js:12904tryCatcher @ Rx.js:234Subscriber.next @ Rx.js:9703Subject._next @ Rx.js:10202Subject.next @ Rx.js:10166EventEmitter.emit @ angular2.dev.js:12885(anonymous function) @ angular2.dev.js:13301Zone.run @ angular2-polyfills.js:1243NgZone._notifyOnTurnDone @ angular2.dev.js:13300(anonymous function) @ angular2.dev.js:13415zoneBoundFn @ angular2-polyfills.js:1220lib$es6$promise$$internal$$tryCatch @ angular2-polyfills.js:468lib$es6$promise$$internal$$invokeCallback @ angular2-polyfills.js:480lib$es6$promise$$internal$$publish @ angular2-polyfills.js:451(anonymous function) @ angular2-polyfills.js:123Zone.run @ angular2-polyfills.js:1243zoneBoundFn @ angular2-polyfills.js:1220lib$es6$promise$asap$$flush @ angular2-polyfills.js:262
angular2.dev.js:22911 ORIGINAL EXCEPTION: TypeError: viewFactory_ColumIteratorComponent0 is not a functionBrowserDomAdapter.logError @ angular2.dev.js:22911ExceptionHandler.call @ angular2.dev.js:1191(anonymous function) @ angular2.dev.js:12562NgZone._notifyOnError @ angular2.dev.js:13485collection_1.StringMapWrapper.merge.onError @ angular2.dev.js:13389Zone.run @ angular2-polyfills.js:1247(anonymous function) @ angular2.dev.js:13408NgZone.run @ angular2.dev.js:13370(anonymous function) @ angular2.dev.js:12661schedulerFn @ angular2.dev.js:12904tryCatcher @ Rx.js:234Subscriber.next @ Rx.js:9703Subject._next @ Rx.js:10202Subject.next @ Rx.js:10166EventEmitter.emit @ angular2.dev.js:12885(anonymous function) @ angular2.dev.js:13301Zone.run @ angular2-polyfills.js:1243NgZone._notifyOnTurnDone @ angular2.dev.js:13300(anonymous function) @ angular2.dev.js:13415zoneBoundFn @ angular2-polyfills.js:1220lib$es6$promise$$internal$$tryCatch @ angular2-polyfills.js:468lib$es6$promise$$internal$$invokeCallback @ angular2-polyfills.js:480lib$es6$promise$$internal$$publish @ angular2-polyfills.js:451(anonymous function) @ angular2-polyfills.js:123Zone.run @ angular2-polyfills.js:1243zoneBoundFn @ angular2-polyfills.js:1220lib$es6$promise$asap$$flush @ angular2-polyfills.js:262
angular2.dev.js:22911 ORIGINAL STACKTRACE:BrowserDomAdapter.logError @ angular2.dev.js:22911ExceptionHandler.call @ angular2.dev.js:1194(anonymous function) @ angular2.dev.js:12562NgZone._notifyOnError @ angular2.dev.js:13485collection_1.StringMapWrapper.merge.onError @ angular2.dev.js:13389Zone.run @ angular2-polyfills.js:1247(anonymous function) @ angular2.dev.js:13408NgZone.run @ angular2.dev.js:13370(anonymous function) @ angular2.dev.js:12661schedulerFn @ angular2.dev.js:12904tryCatcher @ Rx.js:234Subscriber.next @ Rx.js:9703Subject._next @ Rx.js:10202Subject.next @ Rx.js:10166EventEmitter.emit @ angular2.dev.js:12885(anonymous function) @ angular2.dev.js:13301Zone.run @ angular2-polyfills.js:1243NgZone._notifyOnTurnDone @ angular2.dev.js:13300(anonymous function) @ angular2.dev.js:13415zoneBoundFn @ angular2-polyfills.js:1220lib$es6$promise$$internal$$tryCatch @ angular2-polyfills.js:468lib$es6$promise$$internal$$invokeCallback @ angular2-polyfills.js:480lib$es6$promise$$internal$$publish @ angular2-polyfills.js:451(anonymous function) @ angular2-polyfills.js:123Zone.run @ angular2-polyfills.js:1243zoneBoundFn @ angular2-polyfills.js:1220lib$es6$promise$asap$$flush @ angular2-polyfills.js:262
angular2.dev.js:22911 TypeError: viewFactory_ColumIteratorComponent0 is not a function...
于 2016-02-05T09:29:59.727 回答