Question

我尝试使用Angular 6 ng-bootstrap Rating，但它对我不起作用，任何人都知道如何正确添加此评级，

这是我的代码

facilitistatus.component.html

<ngb-rating [(rate)]="currentRate"></ngb-rating>

facilitistatus.component.ts

export class FacilitistatusComponent implements OnInit {

  currentRate = 8;
}

facilitistatus.component.css

/ 费率 /

.star {
  font-size: 1.5rem;
  color: #b0c4de;
}
.filled {
  color: #1e90ff;
}
.heart {
  position: relative;
  display: inline-block;
  font-size: 3rem;
  color: #d3d3d3;
}
.full {
  color: red;
}
.half {
  position: absolute;
  display: inline-block;
  overflow: hidden;
  color: red;
}

错误是

core.js：1598错误错误：未捕获（承诺中）：错误：模板解析错误：无法绑定到“费率”，因为它不是的已知属性 'ngb-rating'。 1.如果“ ngb-rating”是Angular组件且具有“ rate”输入，则请验证它是否属于此模块。 2.如果“ ngb-rating”是Web组件，则将“ CUSTOM_ELEMENTS_SCHEMA”添加到该组件的“ @ NgModule.schemas” 禁止显示此消息。 3.要允许任何属性，请在此组件的“ @ NgModule.schemas”中添加“ NO_ERRORS_SCHEMA”。（“ ] [（rate）] =“ currentRate”>

app.module.ts

 import * as $ from 'jquery';
    import { BrowserModule } from '@angular/platform-browser';
    import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
    import { CommonModule, LocationStrategy, HashLocationStrategy } from '@angular/common';
    import { NgModule } from '@angular/core';
    import { FormsModule } from '@angular/forms';
    import { HttpClientModule, HttpClient } from '@angular/common/http';
    import { Routes, RouterModule } from '@angular/router';
    import { FullComponent } from './layouts/full/full.component';
    import { BlankComponent } from './layouts/blank/blank.component';

    import { NavigationComponent } from './shared/header-navigation/navigation.component';
    import { SidebarComponent } from './shared/sidebar/sidebar.component';
    import { BreadcrumbComponent } from './shared/breadcrumb/breadcrumb.component';
    import { NgbModule } from '@ng-bootstrap/ng-bootstrap';
    import { PerfectScrollbarModule } from 'ngx-perfect-scrollbar';
    import { PERFECT_SCROLLBAR_CONFIG } from 'ngx-perfect-scrollbar';
    import { PerfectScrollbarConfigInterface } from 'ngx-perfect-scrollbar';

    import { Approutes } from './app-routing.module';
    import { AppComponent } from './app.component';
    import { SpinnerComponent } from './shared/spinner.component';
    import { CreatePropertyComponent } from './create-property/create-property.component';

    const DEFAULT_PERFECT_SCROLLBAR_CONFIG: PerfectScrollbarConfigInterface = {
      suppressScrollX: true,
      wheelSpeed: 2,
      wheelPropagation: true,
    };

    @NgModule({
      declarations: [
        AppComponent,
        SpinnerComponent,
        FullComponent,
        BlankComponent,
        NavigationComponent,
        BreadcrumbComponent,
        SidebarComponent,
        CreatePropertyComponent,








      ],
      imports: [
        CommonModule,
        BrowserModule,
        BrowserAnimationsModule,
        FormsModule,
        HttpClientModule,
        NgbModule.forRoot(),
        RouterModule.forRoot(Approutes, { useHash: false }),
        PerfectScrollbarModule
      ],
      providers: [
          {
          provide: PERFECT_SCROLLBAR_CONFIG,
          useValue: DEFAULT_PERFECT_SCROLLBAR_CONFIG
        },{
        provide: LocationStrategy,
        useClass: HashLocationStrategy
      }],
      bootstrap: [AppComponent]
    })
    export class AppModule { }

facilitistatus.module.ts

import { NgModule } from '@angular/core';
import { CommonModule } from '@angular/common';
import { FormsModule } from '@angular/forms';
import { Routes, RouterModule } from '@angular/router';

import {FacilitistatusComponent} from './facilitistatus.component';



const routes: Routes = [{
  path: '',
  data: {
    title: '',
    urls: [{title: 'Dashboard',url: '/dashboard1'},{title: 'Facility Status'}]
  },
  component: FacilitistatusComponent
}];

@NgModule({
  imports: [
    FormsModule,
    CommonModule,
    RouterModule.forChild(routes)
  ],
  declarations: [FacilitistatusComponent]
})
export class FacilitistatusModule{ }

Answer 1

您应该在facilitistatus.module.ts上导入模块

select '%' || 10 * (level - 1) val_disp,
       (level - 1) / 10 val_ret
from dual
connect by level <= (1 - :LOV_1) * 10 + 1;

Angular 6 ng-bootstrap评级不起作用

1 个答案: