Question

我正试图允许用户为他们阅读的书添加评分。我正在使用"@angular/material": "^7.3.0"和"@ng-bootstrap/ng-bootstrap": "^4.0.2".

我已经将以下内容导入了我的app.module.ts

import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import { FormsModule, ReactiveFormsModule } from '@angular/forms';
import { ListComponent } from './components/list/list.component';
import { RegistrationComponent } from './components/registration/registration.component';

import { NgbModule } from '@ng-bootstrap/ng-bootstrap';

我已将NgbModule添加到我的导入中，

imports: [
    ....,
    NgbModule
  ],

我试图在我的list.component.html中显示评级。 list.component.ts看起来像这样，

export class ListComponent implements OnInit {
// other code here
  currentRate = 8;
}

我在list.component.ts中有导入，但与评级实施无关。

用于评级实施的list.component.html如下，

  <ng-container matColumnDef="rating">
    <th mat-header-cell *matHeaderCellDef>Rating</th>
    <td mat-cell>
      <ngb-rating [(rate)]="currentRate"></ngb-rating>
      <pre>Rate: <b>{{currentRate}}</b></pre>
    </td>
  </ng-container>

我正在尝试按照ng-bootstrap rating提供的基本演示示例来实现此目的。显示表格标题，但不显示数据。错误是

core.js:15714 ERROR TypeError: Cannot read property 'template' of undefined

这与我正在尝试的评分实施有关，因为该表格以前工作得很好。预先谢谢你。

Answer 1

我添加了*matCellDef并插入了评级组件的选择器。因此，我现在可以看到评级组件，但是视觉表示与示例中的并不完全相同。我将为此发布另一个问题。

    <ng-container matColumnDef="rating">
        <th mat-header-cell *matHeaderCellDef>Rating</th>
        <td mat-cell *matCellDef="let element">
          <app-rating></app-rating>
        </td>
      </ng-container>

错误TypeError：无法读取未定义的属性“模板”

1 个答案: