Угловые 2+ и наблюдаемые: не могут привязываться к ‘ngModel’, поскольку это не известное свойство ‘select’

EDIT: Обновлено Plunkr: http://plnkr.co/edit/fQ7P9KPjMxb5NAhccYIq?p=preview

эта часть работает:

Label: {{ entry.label }}
Value: {{ entry.value }}

но у меня проблемы с полем выбора, сообщение об ошибке:

Нельзя привязываться к ‘ngModel’, поскольку это не известное свойство ‘select’

Весь компонент:

 //our root app component import {Component} from '@angular/core'; import {NgFor} from '@angular/common'; import {HTTP_PROVIDERS, Http} from '@angular/http'; import 'rxjs/Rx'; import {Observable} from 'rxjs/Rx'; @Component({ selector: 'my-app', providers: [HTTP_PROVIDERS], template: `  {{entry.label}}  
Label: {{ entry.label }}
Value: {{ entry.value }}
`, directives: [NgFor] }) export class App { entries: any = {}; selectValue:any; constructor(private _http: Http) { this.entries = this._http.get("./data.json") .map(res => res.json()); } }

и data.json

 [ { "timestamp": 0, "label": "l1", "value": 1 }, { "timestamp": 0, "label": "l2", "value": 2 }, { "timestamp": 0, "label": "l3", "value": 3 } ] 

    > = RC.5

    FormsModule необходимо импортировать ngModel

     @NgModule({ imports: [BrowserModule /* or CommonModule */, FormsModule, ReactiveFormsModule], ... )} class SomeModule {} 

    <= RC.4

    В config.js добавить

     '@angular/forms': { main: 'bundles/forms.umd.js', defaultExtension: 'js' }, 

    в main.ts добавить

     import {provideForms, disableDeprecatedForms} from '@angular/forms'; bootstrap(App, [disableDeprecatedForms(),provideForms()]) 

    Пример Plunker

    Смотрите также

    В app.modules.ts после

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

    положил:

     import { FormsModule } from '@angular/forms'; 

    И затем в

     imports: [ BrowserModule ], 

    вставьте FormsModule что-то вроде:

     imports: [ BrowserModule, FormsModule ], 

    Это происходило со мной в моем тестовом наборе, несмотря на то, что я уже импортировал FormsModule в файл *.module.ts моего компонента.

    В моем файле *.component.spec.ts мне нужно было добавить как FormsModule и ReactiveFormsModule в список импорта в configureTestingModule :

     import { FormsModule, ReactiveFormsModule } from '@angular/forms'; ... TestBed.configureTestingModule({ imports: [ FormsModule, ReactiveFormsModule, ....], providers: [MyComponent, ...], declarations: [MyComponent], schemas: [CUSTOM_ELEMENTS_SCHEMA] }) 

    Это зафиксировало мой случай.

    Вам нужно добавить следующее в файл app.module.ts .

     import { FormsModule } from '@angular/forms'; 

    А также,

     @NgModule({ imports: [ FormsModule, ... ]}) 

    сделайте следующее, вы должны использовать [ngValue] вместо [val]

      

    Вышеупомянутая ошибка вызвана тем, что вы не импортировали FormsModule, ngModel присутствует в пакете FormsModule, поэтому, чтобы избавиться от этой ошибки, добавьте import {FormsModule} from '@angular/forms' и добавьте FormsModule в импорт в app.module. ts class.

    Interesting Posts

    psql: не удалось подключиться к серверу: нет такого файла или каталога (Mac OS X)

    Как установить Windows Phone 8 SDK на Windows 7

    Запрос Linq, построенный в цикле foreach, всегда принимает значение параметра из последней итерации

    Можете ли вы смешивать языки .net в рамках одного проекта?

    Эквивалентность «С … End With» в C #?

    Что это за маленький порт на моем ноутбуке?

    Иллюстрирование использования ключевого слова volatile в C #

    Требовать XML-элемент в XSD, когда другой элемент имеет определенное значение?

    Как разбирать строку запроса в NameValueCollection в .NET.

    Каковы различия между XmlSerializer и BinaryFormatter

    C ++ не показывает cout в консоли Xcode, но отлично работает в терминале

    Как определить целочисленные типы, которые в два раза больше ширины как `int` и` unsigned`?

    Перенос лицензии Windows 8 и правильной не-переустановки

    Android ViewPager получает текущий вид

    Получить только что удаленный документ

    Давайте будем гением компьютера.