Угловые 2+ и наблюдаемые: не могут привязываться к ‘ngModel’, поскольку это не известное свойство ‘select’
EDIT: Обновлено Plunkr: http://plnkr.co/edit/fQ7P9KPjMxb5NAhccYIq?p=preview
эта часть работает:
Label: {{ entry.label }}
Value: {{ entry.value }} но у меня проблемы с полем выбора, сообщение об ошибке:
- Лучший способ импортировать Observable из rxjs
- Проверка ошибки с наблюдаемыми в сервисах
- Угловое 2 с использованием RxJS - принять (1) против первого ()
Нельзя привязываться к ‘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.