gpt4 book ai didi

Angular 2 Material : can't bind to 'value' since it isn't a known property of 'md-radio-button'

转载 作者:太空狗 更新时间:2023-10-29 17:48:19 27 4
gpt4 key购买 nike

我正在运行来自 here 的单选按钮示例, 我已确保遵循所有 instruction ,除了附录,因为我没有这样的文件(我的应用程序是通过 cli 创建的)。

包含 html 模板后,我的应用程序将无法呈现,并且在控制台中出现错误:

can't bind to 'value' since it isn't a known property of 'md-radio-button

我的 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));
}

}

我的 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>

应用模块:

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 { }

对于解决此问题的建议,我将不胜感激。

最佳答案

由于这似乎还没有得出结论,我想我会提供答案,所有功劳都归功于 Neil Lunn!

由于 Sajeetharan 的回答适用于导入的 MaterialModule,但正如 Neil Lunn 所说:

You should only import the "required" modules

因为否则

this will result in a larger bundle for builds.

所以这很简单,只需将 MdRadioModule 导入到您的应用程序模块并将其添加到 imports 数组即可解决:

import { MdRadioModule } from '@angular/material';

imports: [
....
MdRadioModule,
....
],

关于 Angular 2 Material : can't bind to 'value' since it isn't a known property of 'md-radio-button' ,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/44082354/

27 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com