Angular2 RC5 error:zone.js: Unbehandelte Versprechen Ablehnung: Keine Anbieter für ElementRef

Ich habe vor kurzem ein upgrade von RC4 auf RC5, und nicht ändern von code, aber die app ist gebrochen. Hier ist die Fehlermeldung:
Angular2 RC5 error:zone.js: Unbehandelte Versprechen Ablehnung: Keine Anbieter für ElementRef

Die Fehlermeldung scheint, kam beim laden die index.html Datei:

<html>
<head>
    <script>
        var pjson = require('./package.json');
        document.title = pjson.name;
    </script>
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <link  href="./node_modules/font-awesome/css/font-awesome.min.css">
    <link  href="./node_modules/bootstrap/dist/css/bootstrap.min.css">
    <link  href="./css/global.css">

    <!-- 1. Load libraries -->
    <!-- Polyfill(s) for older browsers -->
    <script src="node_modules/core-js/client/shim.min.js"></script>
    <script src="node_modules/zone.js/dist/zone.js"></script>
    <script src="node_modules/reflect-metadata/Reflect.js"></script>
    <script src="node_modules/systemjs/dist/system.src.js"></script>
    <!-- 2. Configure SystemJS -->
    <script src="systemjs.config.js"></script>
    <script>
        System.import('app/main/bootstrap.js').catch(function(err){ console.error(err); });
    </script>
    <script>
        var electron = require('electron');
    </script>
</head>

<body>
<app-cmp>Loading...</app-cmp>
</body>
</html>

Update: Verwenden Sie Eckige-CLI-jetzt, kein problem mehr.

Es kann helfen, zu sehen, wo Sie mit ElementRef.
Ich habe das gleiche Problem und ich bin nicht die Referenzierung von ElementRef irgendwo in meinem code. Ich habe nur gesehen, das da versucht, sich zu bewegen, um RC.5 mit seiner NgModule brechen ändern.
Ich habe das gleiche Problem wie MichaelOryl, wusste ich nicht, Referenz ElementRef überall.
Versucht, mit Hilfe von ElementRef innerhalb beheben und bekommen there is no provider for ElementRef

InformationsquelleAutor Ng2-Fun | 2016-08-12

  1. 5

    Sieht aus wie Sie haben zu ziehen ElementRef in die imports Abschnitt der @NgModule Anmerkung, wie ich in diesem Beispiel aus meine app.

    Wenn das bedeutet nichts für Sie, dann müssen Sie Lesen, auf der aktuelle änderungen in RC.5 Schwenk-2. Werden Sie whoppers. Hier ist die Dokumentation für NgModule. Finden Sie ein sehr einfaches Beispiel für seine Verwendung in der Schnellstart-Docs. Die app braucht eine Generalüberholung, um es zu bekommen arbeiten, wenn meine persönliche Erfahrung ist jede Angabe. Ich habe noch zu mir zu bekommen wieder zu arbeiten nach ein paar Stunden, und mir ist eine sehr einfache app.

    //app.module.ts
//Angular 2 imports
import { NgModule, ElementRef } from '@angular/core'; // <--- Import ElementRef
import { BrowserModule } from '@angular/platform-browser';
import { RouterModule } from '@angular/router'
import { HTTP_PROVIDERS } from '@angular/http';
import { COMMON_DIRECTIVES } from '@angular/common';

//My components and services (yours will certainly differ)
import {PublicPage} from './components/pages/public-page'
import {ProtectedPage} from './components/pages/protected-page'
import {LoggedoutPage} from "./components/pages/loggedout-page";
import { APP_ROUTES } from './app.routes';
import { WindowService } from './services/window.service';
import { AuthService } from './services/auth.service';
import { CookieService } from './services/cookies.service';

//My main component for this app/module
import { AppComponent }  from './app.component';

@NgModule({
    //Add ElementRef to the module imports below
    imports:      [ ElementRef, BrowserModule, RouterModule.forRoot(APP_ROUTES) ],  
    declarations: [ AppComponent, PublicPage, ProtectedPage, LoggedoutPage ],
    bootstrap:    [ AppComponent ],
    providers:    [ WindowService, AuthService, CookieService, HTTP_PROVIDERS, COMMON_DIRECTIVES ]
})
export class AppModule { }

    Ich dann die Modul-boostrap mit so etwas wie dies:

    //main.ts
import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
import { AppModule } from './app.module';
platformBrowserDynamic().bootstrapModule(AppModule);
    Aber die Sache ist die - es ist nicht eine bedeutende änderung. Finden Sie die migration guide: angular.io/docs/ts/latest/cookbook/rc4-to-rc5.html, Wenn nichts anderes geändert wurde, anders als die alle npm-Module rc5, es "sollte" funktionieren!
    Aber es wird eine wichtige änderung in der finalen Version. Diese migration ist dies Weg zu gehen, wenn die Finale version von Angular 2 endlich veröffentlicht wird. So oder So, es ist eine bedeutende änderung in der RC-phase. Ihr RC.4 code funktioniert nicht mit der final-release von Angular 2.0.
    funktioniert der code oben mit ElementRef Einfuhren gearbeitet ?,
    Ich erstellte ein einfaches Projekt, nach "Import ElementRef" und legte es in NgModule, wie Sie es Tat, bekam ich den Fehler: "TypeError: Cannot read property 'Typ' null". Haben Sie schon den Fehler vor?
    Ich habe versucht, diese Lösung und hab (SystemJS) Unexpected value 'ElementRef' imported by the module 'AppModule'(…). Irgendwelche Ideen?

    InformationsquelleAutor Michael Oryl

  2. 1

    90% sicher, dass die ElementRef soll automatisch importiert werden. Wenn dies zeigt sich dann etwas verloren auf dem Weg... Es soll ja nicht manuell importiert werden

    Ich Stimme mit diesem! Diese Regel bedeutet für mich, etwas wurde falsch importiert oder eine Abhängigkeit fehlt irgendwo höher auf den Baum.

    InformationsquelleAutor Sam Alexander

Schreibe einen Kommentar