Угловое 2 Тестирование приложения застрял на погрузочной

сделать тест приложение для угловых 2, но по некоторым причинам я не могу решить, что мое приложение застрял на «Загрузка ...»Угловое 2 Тестирование приложения застрял на погрузочной

Вот файлы:

app.component.ts:

import {Component} from '@angular/core'; 
import {LittleTourComponent} from './little-tour.component'; 

@Component({ 
    selector: 'my-app', 
    template: ` 
    <h1>Test</h1> 
    <little-tour></little-tour> 
    `, 
    directives: [LittleTourComponent] 
}) 
export class AppComponent { }

мало-tour.component.ts:

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

@Component ({ 
    selector: 'little-tour', 
    template: ` 
     <input #newHero (keyup.enter)='addHero(newHero.value)' 
     (blur)="addHero.(newHero.value); newHero.value = '' "> 

     <button (click) = addHero(newHero.value)>Add</button> 

     <ul><li *ngFor='let hero of heroes'>{{hero}}</li></ul> 
    `, 
}) 

export class LittleTourComponent { 
    heroes = ['Windstorm', 'Bombasto', 'Magneta', 'Tornado']; 
    addHero (value: string) { 
     if (value) { 
      this.heroes.push(value); 
     } 
    } 
}

index.html:

<html> 
    <head> 
    <title>Angular 2 QuickStart</title> 
    <meta charset="UTF-8"> 
    <meta name="viewport" content="width=device-width, initial-scale=1"> 
    <link rel="stylesheet" href="styles.css"> 

    <!-- 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> 

    <script src="systemjs.config.js"></script> 
    <script> 
     System.import('app').catch(function(err){ console.error(err); }); 
    </script> 
    </head> 

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

и main.ts:

import {bootstrap} from '@angular/platform-browser-dynamic'; 
import {AppComponent} from './app.component'; 

bootstrap(AppComponent);

Терминал не дает каких-либо ошибок, когда я начинаю НПМ, но я уверен, что там что-то должно быть, я пропустил в коде. Поскольку я все еще пытаюсь обернуть голову вокруг основ Angular 2, вам будет очень благодарна ваша помощь. Спасибо!

источник

2016-06-20 MoSheikh

проблема здесь, '<ввод #newHero (keyup.enter) = 'addHero (newHero.value)' (blur) = "addHero. (newHero.value); newHero.value = ''"> ', что вы пытаетесь сделать? –

Он теперь работает с этим:

<input #newHero (keyup.enter)='addHero(newHero.value)' 
    (blur)="addHero" newHero.value = '' >

plunker

Вы можете добавить значение из вашего поля ввода в список следующим образом:

<input [(ngModel)] = "newHero"> 
<button (click) = addHero(newHero)>Add</button> 
<ul><li *ngFor='let hero of heroes'>{{hero}}</li></ul>

источник

2016-06-20 02:24:07

Спасибо, я просто пытался следовать примеру в Angular 2 Docs, но я сделал глупую ошибку. – MoSheikh

Угловое 2 Тестирование приложения застрял на погрузочной

ответ

Смежные вопросы