Angulaire 2 Matériel: ne peut pas se lier à la 'valeur', car il n'est pas connu propriété de md-radio-bouton"

Je suis en cours d'exécution un exemple de boutons radio ici, j'ai pris soin de suivre toutes les l'instruction, à l'exception de l'annexe, car je n'ai pas
un tel fichier (mon app a été créé cli).

Après, y compris le modèle html mon application ne sont pas rendus et dans la console j'ai une erreur:

ne peut pas se lier à la 'valeur', car il n'est pas connu de la propriété de
'md-radio-bouton

Mon fichier ts:

import { Component, OnInit } from '@angular/core';
import { SlidesService } from 'app/slides/slides.service';
import { Slide } from 'app/slides/slide';
import { Observable } from 'rxjs/Rx';
import { Subscription } from 'rxjs/Subscription';
import { MdButtonModule, MdCheckboxModule } from '@angular/material';

@Component({
  selector: 'app-question',
  templateUrl: './question.component.html',
  styleUrls: ['./question.component.css']
})
export class QuestionComponent implements OnInit {

  constructor(private _slidesService: SlidesService) { }
  slides: Slide[];
  currSlide: Slide;
  favoriteSeason: string;

  seasons = [
    'Winter',
    'Spring',
    'Summer',
    'Autumn',
  ];
  ngOnInit() {
    this._slidesService.getSlides()
      .subscribe(slides => {
        this.slides = slides
        this.currSlide = slides[0];

      },
      error => console.log(<any>error));
  }

}

mon fichier html:

<div class="well well-lg" *ngIf='slides && slides.length'>
  <img [src]='slides[0].imageUrl'>
  <h1>{{currSlide.SongTitle}}</h1>
  <md-radio-group class="example-radio-group" [(ngModel)]="favoriteSeason">
    <md-radio-button class="example-radio-button" *ngFor="let season of seasons" [value]="season">
      {{season}}
    </md-radio-button>
  </md-radio-group>
  <div class="example-selected-value">Your favorite season is: {{favoriteSeason}}</div>
</div>

AppModule:

import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import { FormsModule } from '@angular/forms';
import { HttpModule } from '@angular/http';
import { AlertModule } from 'ngx-bootstrap';
import { CarouselModule } from 'ngx-bootstrap/carousel';
import { AppComponent } from './app.component';
import { SlidesComponent } from './slides/slides.component';
import { SlidesService } from './slides/slides.service';
import { QuestionComponent } from './question/question.component';
import { MdButtonModule, MdCheckboxModule } from '@angular/material';
import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
import { FormControl, FormGroup } from '@angular/forms';
import { MaterialModule } from '@angular/material';
import { ReactiveFormsModule } from '@angular/forms';
@NgModule({
  declarations: [
    AppComponent,
    SlidesComponent,
    QuestionComponent
  ],
  imports: [ReactiveFormsModule, MaterialModule,
    BrowserAnimationsModule,
    MdButtonModule,
    MdCheckboxModule,
    BrowserModule,
    FormsModule,
    HttpModule,
    AlertModule.forRoot(),
    CarouselModule.forRoot()
  ],
  providers: [SlidesService],
  bootstrap: [AppComponent]
})
export class AppModule { }

J'apprécierais des suggestions pour résoudre ce problème.

  • MdButtonModule (en fait tous de votre matériel, les modules doivent être importés dans AppModule, ou que ce soit contenant le module de cette composante de la vie dans des modules imports tableau. PAS Dans le composant. Tous les import déclaration ici n'est des importations de la "sybmol". Vous n'êtes pas réellement consommer n'importe où, ni est-il possible de le faire dans un composant.
  • Je n'étais pas sûr à ce sujet, et j'ai importé les symboles à la fois dans le composant fichier ts et à la fois dans le AppModule (et les importations de tableau). Après votre commentaire que j'ai essayé de supprimer les importations en provenance de la composante et l'a laissé seul dans la AppModule - mais j'obtiens le même message d'erreur
  • est-il possible pour vous d'ajouter votre appModule définition? Ressemble vous manquent pour ajouter un peu de déclaration comme CommonModule ou FormModule
  • Ouais. Manquant MdRadioModule comme mentionné.
InformationsquelleAutor Belgi | 2017-05-20