angular2-seltsame Fehler beim Ausführen von "Hellow"

Ich konnte keinen guten Titel für dieses grundlegende Problem finden. Im mit diesem Saatgutprojekt: https://www.npmjs.com/package/angular2-goldilocks-seed angular2-seltsame Fehler beim Ausführen von "Hellow"

Nach dem Versuch, einige grundlegenden Befehle von hier zu implementieren: https://angular.io/docs/ts/latest/guide/displaying-data.html

Die Seite nicht geladen werden. Sein aufgeklebt: "Loading ..."

greeting.ts:

import {Component} from 'angular2/core'; 

@Component({ 
    selector: 'greeting', 
    templateUrl: 'app/greeting/greeting.html', 
    styleUrls: ['app/greeting/greeting.css'] 
}) 
export default class Greeting { 
    title = 'Tour of Heroes'; 
    heroes = ['Windstorm', 'Bombasto', 'Magneta', 'Tornado']; 
    myHero = this.heroes[0]; 
}

greeting.html:

<h1>{{title}}</h1> 
<h2>My favorite hero is: {{myHero}}</h2> 
<p>Heroes:</p> 
<ul> 
    <li *ngFor="let hero of heroes"> 
     {{ hero }} 
    </li> 
</ul>

Ich habe keine Fehler im Compiler auf WebStorm aber die Entwicklertools geht Konsole verrückt:

angular2.dev.js:23524 EXCEPTION: Template parse errors: 
Can't bind to 'ngFor' since it isn't a known native property (" 
<p>Heroes:</p> 
<ul> 
    <li [ERROR ->]*ngFor="let hero of heroes"> 
     {{ hero }} 
    </li> 
"): [email protected]:8 
Can't bind to 'ngForHero' since it isn't a known native property (" 
<p>Heroes:</p> 
<ul> 
    <li [ERROR ->]*ngFor="let hero of heroes"> 
     {{ hero }} 
    </li> 
"): [email protected]:8 
Property binding ngFor not used by any directive on an embedded template (" 
<p>Heroes:</p> 
<ul> 
    [ERROR ->]<li *ngFor="let hero of heroes"> 
     {{ hero }} 
    </li> 
"): [email protected]:4 
Property binding ngForHero not used by any directive on an embedded template (" 
<p>Heroes:</p> 
<ul> 
    [ERROR ->]<li *ngFor="let hero of heroes"> 
     {{ hero }} 
    </li> 
"): [email protected]:4 
angular2.dev.js:23514 EXCEPTION: Template parse errors: 
Can't bind to 'ngFor' since it isn't a known native property (" 
<p>Heroes:</p> 
<ul> 
    <li [ERROR ->]*ngFor="let hero of heroes"> 
     {{ hero }} 
    </li> 
"): [email protected]:8 
Can't bind to 'ngForHero' since it isn't a known native property (" 
<p>Heroes:</p> 
<ul> 
    <li [ERROR ->]*ngFor="let hero of heroes"> 
     {{ hero }} 
    </li> 
"): [email protected]:8 
Property binding ngFor not used by any directive on an embedded template (" 
<p>Heroes:</p> 
<ul> 
    [ERROR ->]<li *ngFor="let hero of heroes"> 
     {{ hero }} 
    </li> 
"): [email protected]:4 
Property binding ngForHero not used by any directive on an embedded template (" 
<p>Heroes:</p> 
<ul> 
    [ERROR ->]<li *ngFor="let hero of heroes"> 
     {{ hero }} 
    </li> 
"): [email protected]:4BrowserDomAdapter.logError @ angular2.dev.js:23514BrowserDomAdapter.logGroup @ angular2.dev.js:23525ExceptionHandler.call @ angular2.dev.js:1145(anonymous function) @ angular2.dev.js:14801NgZone._notifyOnError @ angular2.dev.js:5796onError @ angular2.dev.js:5700run @ angular2-polyfills.js:141(anonymous function) @ angular2.dev.js:5719zoneBoundFn @ angular2-polyfills.js:111lib$es6$promise$$internal$$tryCatch @ angular2-polyfills.js:1511lib$es6$promise$$internal$$invokeCallback @ angular2-polyfills.js:1523lib$es6$promise$$internal$$publish @ angular2-polyfills.js:1494(anonymous function) @ angular2-polyfills.js:243microtask @ angular2.dev.js:5751run @ angular2-polyfills.js:138(anonymous function) @ angular2.dev.js:5719zoneBoundFn @ angular2-polyfills.js:111lib$es6$promise$asap$$flush @ angular2-polyfills.js:1305 
angular2.dev.js:23514 STACKTRACE:BrowserDomAdapter.logError @ angular2.dev.js:23514ExceptionHandler.call @ angular2.dev.js:1147(anonymous function) @ angular2.dev.js:14801NgZone._notifyOnError @ angular2.dev.js:5796onError @ angular2.dev.js:5700run @ angular2-polyfills.js:141(anonymous function) @ angular2.dev.js:5719zoneBoundFn @ angular2-polyfills.js:111lib$es6$promise$$internal$$tryCatch @ angular2-polyfills.js:1511lib$es6$promise$$internal$$invokeCallback @ angular2-polyfills.js:1523lib$es6$promise$$internal$$publish @ angular2-polyfills.js:1494(anonymous function) @ angular2-polyfills.js:243microtask @ angular2.dev.js:5751run @ angular2-polyfills.js:138(anonymous function) @ angular2.dev.js:5719zoneBoundFn @ angular2-polyfills.js:111lib$es6$promise$asap$$flush @ angular2-polyfills.js:1305 
angular2.dev.js:23514 Error: Template parse errors: 
Can't bind to 'ngFor' since it isn't a known native property (" 
<p>Heroes:</p> 
<ul> 
    <li [ERROR ->]*ngFor="let hero of heroes"> 
     {{ hero }} 
    </li> 
"): [email protected]:8 
Can't bind to 'ngForHero' since it isn't a known native property (" 
<p>Heroes:</p> 
<ul> 
    <li [ERROR ->]*ngFor="let hero of heroes"> 
     {{ hero }} 
    </li> 
"): [email protected]:8 
Property binding ngFor not used by any directive on an embedded template (" 
<p>Heroes:</p> 
<ul> 
    [ERROR ->]<li *ngFor="let hero of heroes"> 
     {{ hero }} 
    </li> 
"): [email protected]:4 
Property binding ngForHero not used by any directive on an embedded template (" 
<p>Heroes:</p> 
<ul> 
    [ERROR ->]<li *ngFor="let hero of heroes"> 
     {{ hero }} 
    </li> 
"): [email protected]:4 
    at new BaseException (http://localhost:3000/lib/angular2.dev.js:8080:21) 
    at TemplateParser.parse (http://localhost:3000/lib/angular2.dev.js:24042:15) 
    at http://localhost:3000/lib/angular2.dev.js:24669:54 
    at Zone.run (http://localhost:3000/lib/angular2-polyfills.js:138:17) 
    at Zone.run (http://localhost:3000/lib/angular2.dev.js:5719:32) 
    at zoneBoundFn (http://localhost:3000/lib/angular2-polyfills.js:111:19) 
    at lib$es6$promise$$internal$$tryCatch (http://localhost:3000/lib/angular2-polyfills.js:1511:16) 
    at lib$es6$promise$$internal$$invokeCallback (http://localhost:3000/lib/angular2-polyfills.js:1523:17) 
    at lib$es6$promise$$internal$$publish (http://localhost:3000/lib/angular2-polyfills.js:1494:11) 
    at http://localhost:3000/lib/angular2-polyfills.js:243:5 

-----async gap----- 
Error 
    at _getStacktraceWithUncaughtError (http://localhost:3000/lib/angular2-polyfills.js:2195:26) 
    at Zone.fork (http://localhost:3000/lib/angular2-polyfills.js:2253:40) 
    at Zone.bind (http://localhost:3000/lib/angular2-polyfills.js:109:48) 
    at bindArguments (http://localhost:3000/lib/angular2-polyfills.js:980:29) 
    at lib$es6$promise$promise$$Promise.obj.(anonymous function) [as then] (http://localhost:3000/lib/angular2-polyfills.js:1000:37) 
    at TemplateCompiler._compileComponentRuntime (http://localhost:3000/lib/angular2.dev.js:24666:14) 
    at RuntimeCommandFactory.componentTemplateFactory (http://localhost:3000/lib/angular2.dev.js:24695:35) 
    at RuntimeCommandFactory.createBeginComponent (http://localhost:3000/lib/angular2.dev.js:19934:41) 
    at CommandBuilderVisitor.visitElement (http://localhost:3000/lib/angular2.dev.js:20040:46) 
    at ElementAst.visit (http://localhost:3000/lib/angular2.dev.js:19439:22) 

-----async gap----- 
Error 
    at _getStacktraceWithUncaughtError (http://localhost:3000/lib/angular2-polyfills.js:2195:26) 
    at Zone.fork (http://localhost:3000/lib/angular2-polyfills.js:2253:40) 
    at Zone.bind (http://localhost:3000/lib/angular2-polyfills.js:109:48) 
    at bindArguments (http://localhost:3000/lib/angular2-polyfills.js:980:29) 
    at lib$es6$promise$promise$$Promise.obj.(anonymous function) [as then] (http://localhost:3000/lib/angular2-polyfills.js:1000:37) 
    at TemplateCompiler._compileComponentRuntime (http://localhost:3000/lib/angular2.dev.js:24666:14) 
    at TemplateCompiler.compileHostComponentRuntime (http://localhost:3000/lib/angular2.dev.js:24637:14) 
    at RuntimeCompiler_.compileInHost (http://localhost:3000/lib/angular2.dev.js:24860:37) 
    at DynamicComponentLoader_.loadAsRoot (http://localhost:3000/lib/angular2.dev.js:14530:29) 
    at useFactory (http://localhost:3000/lib/angular2.dev.js:14672:39) 

-----async gap----- 
Error 
    at _getStacktraceWithUncaughtError (http://localhost:3000/lib/angular2-polyfills.js:2195:26) 
    at Zone.fork (http://localhost:3000/lib/angular2-polyfills.js:2253:40) 
    at NgZone._createInnerZone (http://localhost:3000/lib/angular2.dev.js:5707:39) 
    at new NgZone (http://localhost:3000/lib/angular2.dev.js:5573:32) 
    at createNgZone (http://localhost:3000/lib/angular2.dev.js:14693:12) 
    at PlatformRef_.application (http://localhost:3000/lib/angular2.dev.js:14768:31) 
    at Object.bootstrap (http://localhost:3000/lib/angular2.dev.js:25054:64) 
    at execute (http://localhost:3000/app/bootstrap.js:14:23) 
    at ensureEvaluated (http://localhost:3000/lib/system.src.js:2981:26) 
    at Object.execute (http://localhost:3000/lib/system.src.js:3099:13)BrowserDomAdapter.logError @ angular2.dev.js:23514ExceptionHandler.call @ angular2.dev.js:1148(anonymous function) @ angular2.dev.js:14801NgZone._notifyOnError @ angular2.dev.js:5796onError @ angular2.dev.js:5700run @ angular2-polyfills.js:141(anonymous function) @ angular2.dev.js:5719zoneBoundFn @ angular2-polyfills.js:111lib$es6$promise$$internal$$tryCatch @ angular2-polyfills.js:1511lib$es6$promise$$internal$$invokeCallback @ angular2-polyfills.js:1523lib$es6$promise$$internal$$publish @ angular2-polyfills.js:1494(anonymous function) @ angular2-polyfills.js:243microtask @ angular2.dev.js:5751run @ angular2-polyfills.js:138(anonymous function) @ angular2.dev.js:5719zoneBoundFn @ angular2-polyfills.js:111lib$es6$promise$asap$$flush @ angular2-polyfills.js:1305

Quelle

2016-07-02 Stav Alfi

angular2-goldilocks-Saatgutprojekt gebaut mit 2.0.0-beta. 6

Sie müssen Ihre Version auf den neuesten Stand 2.0.0-rc.4 aktualisieren oder Ihre ngFor-Syntax ändern.

Bis beta.17 ngFor wie folgt aussieht:

<div *ngFor="#hero of heroes; #i=index"> 
    {{i + 1}} - {{hero.fullName}} 
</div>

Von RC, ab * ngFor sieht wie folgt aus:

<div *ngFor="let hero of heroes; let i=index"> 
    {{i + 1}} - {{hero.fullName}} 
</div>

sehen, ob das hilft.

Quelle

2016-07-02 14:22:56 Sanket

Erstens, danke für die schnelle Antwort. Nun, was genau muss ich aktualisieren und wie? –

Ich würde vorschlagen, aktualisieren Sie Ihre Version auf RC4. Dazu müssen Sie in Ihrer package.json die eckige Version auf 2.0.0-rc.4 aktualisieren. Sie können Paket.json aus eckigen Quickstart-Artikel hier verweisen - https://angular.io/docs/ts/latest/quickstart.html – Sanket

Ich ersetzte die Paket.jason Datei mit thiers und im gegenüberliegende Fehler beim Versuch, Npm zu installieren. –

angular2-seltsame Fehler beim Ausführen von "Hellow"

Antwort

Verwandte Themen