nullエラーの「クエリ」に奇妙なアクセスできません

Question

このエラーは何ですか？より記述的なエラーから利益を得ることができましたが、これは私を失ってしまったのです。私がやったことは一切言及されておらず、ちょうどそれが起こります。コードはAngular2 beta.9で動作していましたが、rc1にアップグレードした後、これが発生し始めました。 Angular2または溶液中の狂気何に何の拡張、単にコンポーネント：

コンポーネント

import {Component, ElementRef} from '@angular/core'; 

@Component({ 
    selector: 'login-form', 
    templateUrl: '/Home/Login.html' 
}) 
export class Login {   
    constructor(elm: ElementRef) { } 
} 

はまた、すべての角度のファイルが正しくロードされません。これは、設定され

browser_adapter.ts:78 EXCEPTION: Error: Uncaught (in promise): TypeError: Cannot read property 'query' of null 
BrowserDomAdapter.logError 
@ browser_adapter.ts:78 BrowserDomAdapter.logGroup 
@ browser_adapter.ts:89 ExceptionHandler.call 
@ exception_handler.ts:53(anonymous function) 
@ application_ref.ts:304 schedulerFn 
@ async.ts:131 SafeSubscriber.__tryOrUnsub 
@ Subscriber.ts:240 SafeSubscriber.next 
@ Subscriber.ts:192 Subscriber._next 
@ Subscriber.ts:133 Subscriber.next 
@ Subscriber.ts:93 Subject._finalNext 
@ Subject.ts:154 Subject._next 
@ Subject.ts:144Subject.next 
@ Subject.ts:90EventEmitter.emit 
@ async.ts:117NgZone._zoneImpl.ng_zone_impl_1.NgZoneImpl.onError 
@ ng_zone.ts:138NgZoneImpl.inner.inner.fork.onHandleError 
@ ng_zone_impl.ts:90ZoneDelegate.handleError 
@ zone.js:327Zone.runGuarded 
@ zone.js:233_loop_1 
@ zone.js:487drainMicroTaskQueue 
@ zone.js:494ZoneTask.invoke 
@ zone.js:426 browser_adapter.ts:78STACKTRACE:BrowserDomAdapter.logError 
@ browser_adapter.ts:78ExceptionHandler.call 
@ exception_handler.ts:56(anonymous function) 
@ application_ref.ts:304schedulerFn 
@ async.ts:131SafeSubscriber.__tryOrUnsub 
@ Subscriber.ts:240SafeSubscriber.next 
@ Subscriber.ts:192Subscriber._next 
@ Subscriber.ts:133Subscriber.next 
@ Subscriber.ts:93Subject._finalNext 
@ Subject.ts:154Subject._next 
@ Subject.ts:144Subject.next 
@ Subject.ts:90EventEmitter.emit 
@ async.ts:117NgZone._zoneImpl.ng_zone_impl_1.NgZoneImpl.onError 
@ ng_zone.ts:138NgZoneImpl.inner.inner.fork.onHandleError 
@ ng_zone_impl.ts:90ZoneDelegate.handleError 
@ zone.js:327Zone.runGuarded 
@ zone.js:233_loop_1 
@ zone.js:487drainMicroTaskQueue 
@ zone.js:494ZoneTask.invoke 
@ zone.js:426 
browser_adapter.ts:78Error: Uncaught (in promise): TypeError: Cannot read property 'query' of null 
    at resolvePromise (zone.js:538) 
    at PromiseCompleter.reject (zone.js:515) 
    at eval (application_ref.ts:340) 
    at ZoneDelegate.invoke (zone.js:323) 
    at Object.NgZoneImpl.inner.inner.fork.onInvoke (ng_zone_impl.ts:67) 
    at ZoneDelegate.invoke (zone.js:322) 
    at Zone.run (zone.js:216) 
    at zone.js:571 
    at ZoneDelegate.invokeTask (zone.js:356) 
    at Object.NgZoneImpl.inner.inner.fork.onInvokeTask (ng_zone_impl.ts:56)BrowserDomAdapter.logError 
@ browser_adapter.ts:78ExceptionHandler.call 
@ exception_handler.ts:57(anonymous function) 
@ application_ref.ts:304schedulerFn 
@ async.ts:131SafeSubscriber.__tryOrUnsub 
@ Subscriber.ts:240SafeSubscriber.next 
@ Subscriber.ts:192Subscriber._next 
@ Subscriber.ts:133Subscriber.next 
@ Subscriber.ts:93Subject._finalNext 
@ Subject.ts:154Subject._next 
@ Subject.ts:144Subject.next 
@ Subject.ts:90EventEmitter.emit 
@ async.ts:117NgZone._zoneImpl.ng_zone_impl_1.NgZoneImpl.onError 
@ ng_zone.ts:138NgZoneImpl.inner.inner.fork.onHandleError 
@ ng_zone_impl.ts:90ZoneDelegate.handleError 
@ zone.js:327Zone.runGuarded 
@ zone.js:233_loop_1 
@ zone.js:487drainMicroTaskQueue 
@ zone.js:494ZoneTask.invoke 
@ zone.js:426 
zone.js:461 Unhandled Promise rejection: Cannot read property 'query' of null ; Zone: angular ; Task: Promise.then ; Value: TypeError: Cannot read property 'query' of null(…)consoleError 
@ zone.js:461_loop_1 
@ zone.js:490drainMicroTaskQueue 
@ zone.js:494ZoneTask.invoke 
@ zone.js:426 
zone.js:463 Error: Uncaught (in promise): TypeError: Cannot read property 'query' of null(…) 

更新：これはエラーのスタックトレースである私の場合は

<script src="/node_modules/es6-shim/es6-shim.js"></script> 
    <script src="/node_modules/reflect-metadata/Reflect.js"></script> 
    <script src="/node_modules/zone.js/dist/zone.js"></script> 
    <script src="/node_modules/systemjs/dist/system.js"></script> 

    <script type="text/javascript"> 
      System.config({ 
       defaultJSExtensions: true, 
       baseURL: 'lib/src/scripts', 
       map: { 
        '@angular/common': '../../node_modules/@angular/common/index', 
        '@angular/core': '../../node_modules/@angular/core/index', 
        '@angular/compiler': '../../node_modules/@angular/compiler/index', 
        '@angular/http': '../../node_modules/@angular/http/index', 
        '@angular/platform-browser': '../../node_modules/@angular/platform-browser/index', 
        '@angular/platform-browser-dynamic': '../../node_modules/@angular/platform-browser-dynamic/index', 
        '@angular/router': '../../node_modules/@angular/router/index', 
        'rxjs': '../../node_modules/rxjs' 
       } 
      }); 
    </script> 

Answer 1

タイプスクリプトの設定がモジュールの設定（別名モジュール101）と一致していることを確認してください。問題は元のモジュール設定がSystemJSとして実行されましたが、moduleオプションがtsconfig.jsonに 'commonjs'に設定されていたことです。 'SystemJS'が 'commonjs'をポリエフィルすると考えられていたにもかかわらず、あまりにも狂っていたのは不思議ではありませんでしたが、まだまだこの狂ったエラーがありました。

更新

はこのようにあなたtsconfig.jsonファイルを変更します。

//if planning to build a release bundle, remember to use the following on top of every .ts file if using this configuration. 
//use /// <amd-module name="your .ts file path from site root" /> for a named system.register (module: "system") or define (module: "amd") 
{ 
    "compileOnSave": true, 
    "compilerOptions": { 
    "emitDecoratorMetadata": true, 
    "experimentalDecorators": true, 
    "module": "amd", 
    "moduleResolution": "node", 
    "removeComments": true, 
    "noImplicitAny": false, 
    "sourceMap": true, 
    "target": "es3" //or es5, es6 if you can 
    } 
} 

をさらに、あなたもnode_modulesとtypingsを除外したい場合があります、私は必要はありませんでした：

... 
exclude: ["node_modules", "typings"] 
... 

ここではトリックは、commonjsをva lue moduleですので、amdまたはsystemを使用することができます。私の場合は、systemjs-builderのリリースビルドプロセスにより、モジュールローダーを含まないようにamdを選択しました。 ElementRef`コンストラクタパラメータ：あなたは `ニレを削除する場合

System.config({ 
    defaultJSExtensions: true, 
    baseURL: '/', 
    map: { 
     '@angular/common': 'node_modules/@angular/common/index', 
     '@angular/core': 'node_modules/@angular/core/index', 
     '@angular/compiler': 'node_modules/@angular/compiler/index', 
     '@angular/http': 'node_modules/@angular/http/index', 
     '@angular/platform-browser': 'node_modules/@angular/platform-browser/index', 
     '@angular/platform-browser-dynamic': 'node_modules/@angular/platform-browser-dynamic/index', 
     '@angular/router': 'node_modules/@angular/router/index', 
     'rxjs': 'node_modules/rxjs' 
    } 
}); 

Answer 2

、私はtypescriptですオプション--emitDecoratorMetadataを設定することで、この問題を解決し、希望それはいくつかの人々を助けるでしょう。