2017-07-15 35 views
9

Jestem nowy w firmie Angular i zainstalowałem materiał kątowy. Próbowałem na datepicker i jego pokazując mi ten błąd:Błąd typu przy użyciu materiału kątowego

MdInputContainer.html:1 ERROR TypeError: this.engine.setProperty is not a function 
    at AnimationRenderer.webpackJsonp.../../../platform-browser/@angular/platform-browser/animations.es5.js.AnimationRenderer.setProperty (animations.es5.js:502) 
    at DebugRenderer2.webpackJsonp.../../../core/@angular/core.es5.js.DebugRenderer2.setProperty (core.es5.js:13781) 
    at setElementProperty (core.es5.js:9443) 
    at checkAndUpdateElementValue (core.es5.js:9362) 
    at checkAndUpdateElementInline (core.es5.js:9296) 
    at checkAndUpdateNodeInline (core.es5.js:12375) 
    at checkAndUpdateNode (core.es5.js:12321) 
    at debugCheckAndUpdateNode (core.es5.js:13182) 
    at debugCheckRenderNodeFn (core.es5.js:13161) 
    at Object.eval [as updateRenderer] (MdInputContainer.html:1) 

app.module.ts

import { BrowserModule } from '@angular/platform-browser'; 
import {BrowserAnimationsModule} from '@angular/platform-browser/animations'; 
import { NgModule } from '@angular/core'; 
import { FormsModule, ReactiveFormsModule } from '@angular/forms'; 
import { HttpModule } from '@angular/http'; 
import {AppRoutingModule} from './app-routing.module'; 
import { NavigationComponent } from './navigation/navigation.component'; 
import { HomeComponent } from './home/home.component'; 
import { EditComponent } from './edit/edit.component'; 
import { AddComponent } from './add/add.component'; 
import { ShowComponent } from './show/show.component'; 
import { EmpService } from './emp.service'; 
import 'hammerjs'; 
import { AppComponent } from './app.component'; 

import { 
    MdAutocompleteModule, 
    MdButtonModule, 
    MdButtonToggleModule, 
    MdCardModule, 
    MdCheckboxModule, 
    MdChipsModule, 
    MdCoreModule, 
    MdDatepickerModule, 
    MdDialogModule, 
    MdExpansionModule, 
    MdGridListModule, 
    MdIconModule, 
    MdInputModule, 
    MdListModule, 
    MdMenuModule, 
    MdNativeDateModule, 
    MdPaginatorModule, 
    MdProgressBarModule, 
    MdProgressSpinnerModule, 
    MdRadioModule, 
    MdRippleModule, 
    MdSelectModule, 
    MdSidenavModule, 
    MdSliderModule, 
    MdSlideToggleModule, 
    MdSnackBarModule, 
    MdSortModule, 
    MdTableModule, 
    MdTabsModule, 
    MdToolbarModule, 
    MdTooltipModule, 
} from '@angular/material'; 

import {CdkTableModule} from '@angular/cdk'; 

@NgModule({ 
    declarations: [ 
    AppComponent, 
    NavigationComponent, 
    HomeComponent, 
    EditComponent, 
    AddComponent, 
    ShowComponent 

    ], 
    imports: [ 
    BrowserModule, 
    BrowserAnimationsModule , 
    MdDatepickerModule, 
    MdNativeDateModule, 
    MdInputModule, 
    FormsModule, 
    ReactiveFormsModule, 
    HttpModule, 
    AppRoutingModule 
    ], 

    providers: [EmpService], 
    bootstrap: [AppComponent] 
}) 
export class AppModule { } 

HTML

<md-input-container> 
    <input mdInput [mdDatepicker]="picker" placeholder="Choose a date"> 
    <button mdSuffix [mdDatepickerToggle]="picker"></button> 
</md-input-container> 
<md-datepicker #picker></md-datepicker> 

mam wziąć odwołanie od oficjalnej stronie niej i działa poprawnie, ale chcę rozwiązać błędy.

Dziękuję.

+0

udostępnij swoje 'app.module.ts' i html – Nehal

+0

@Nehal Proszę spojrzeć na zaktualizowaną wersję pytania. Zarówno app.module.ts jak i kod html są teraz dodawane. – Rush1312

+0

dzięki za dodanie tych plików. Czy możesz dodać pakiet 'package.json'? Wygląda na to, że czegoś brakuje w '@ angle/core', który powoduje ten problem! – Nehal

Odpowiedz

23

Spróbuj zaktualizować zależności kątowe.

Najpierw uruchom:

npm outdated 

w folderze gdzie package.json znajduje.

Jeśli są nieaktualne zależności uruchom:

npm update 

Byłem też w obliczu tego problemu dzisiaj, a po aktualizacji pakietów wszystko zaczęło dobrze działać.

+1

Wpadłem na ten sam problem opisany powyżej, również po aktualizacji @ angle/cli. Zastosowano się do sugestii sprawdzania aktualizacji i stwierdzono, że około 10 było nieaktualnych. Po aktualizacji błąd zniknął. Dzięki! – dc922

+0

Ten też mi pomógł! Dzięki (Y) – Faisal

-1

Konieczność upewnienia się, że wszystkie rdzenie "@ kątowe/*": "^ 4.4.5". enter image description here

+2

Czy łatwiej było Ci wziąć wydrukowany ekran i przesłać go gdzieś, a nie tylko skopiować/wkleić tekst? – Styx