0

更新： md-table 使用似乎导致此问题的 flex 布局指令包装在某些容器中。我正在更新代码以显示这些包装器。具体来说，外部包装器中的 fxLayoutGap 正在破坏应用程序

我在角度 4 中有这个数据表，它显示了数据库中的记录列表。在特定行单击（实际上是单元格单击）时，应用程序旨在显示该行的详细数据（应用程序中的另一个 url）。我试图通过在 md-cells 中使用 routerLink 锚来实现这一点，如下所示：

<div class="main-content-container" fxLayoutGap="10px">
    <div class="table-container mat-elevation-z8" fxLayout.xs="column">
        <md-table #table [dataSource]="dataSource" fxFlex="100">

            <ng-container cdkColumnDef="id">
                <md-header-cell *cdkHeaderCellDef> ID </md-header-cell>
                <md-cell *cdkCellDef="let row"> 
                    <a [routerLink]="['/detail']">{{row.id}}</a> 
                </md-cell>
            </ng-container>
            ...
        </md-table>
    </div>
</div>

但是当我尝试这个时，我在浏览器控制台中收到一个奇怪的错误，似乎与我的代码中的任何内容都无关：

ERROR Error: Uncaught (in promise): TypeError: _this._renderer.setStyle is not a function
TypeError: _this._renderer.setStyle is not a function
at base.js:107
at Array.forEach (<anonymous>)
at base.js:107
at Array.forEach (<anonymous>)
at FlexDirective.webpackJsonp.../../../flex-layout/flexbox/api/base.js.BaseFxDirective._applyStyleToElements (base.js:106)
at FlexDirective.webpackJsonp.../../../flex-layout/flexbox/api/base.js.BaseFxDirective._getFlowDirection (base.js:78)
at FlexDirective.webpackJsonp.../../../flex-layout/flexbox/api/flex.js.FlexDirective._validateValue (flex.js:200)
at FlexDirective.webpackJsonp.../../../flex-layout/flexbox/api/flex.js.FlexDirective._updateStyle (flex.js:192)
at FlexDirective.webpackJsonp.../../../flex-layout/flexbox/api/flex.js.FlexDirective._onLayoutChange (flex.js:183)
at SafeSubscriber._next (flex.js:50)
at base.js:107
at Array.forEach (<anonymous>)
at base.js:107
at Array.forEach (<anonymous>)
at FlexDirective.webpackJsonp.../../../flex-layout/flexbox/api/base.js.BaseFxDirective._applyStyleToElements (base.js:106)
at FlexDirective.webpackJsonp.../../../flex-layout/flexbox/api/base.js.BaseFxDirective._getFlowDirection (base.js:78)
at FlexDirective.webpackJsonp.../../../flex-layout/flexbox/api/flex.js.FlexDirective._validateValue (flex.js:200)
at FlexDirective.webpackJsonp.../../../flex-layout/flexbox/api/flex.js.FlexDirective._updateStyle (flex.js:192)
at FlexDirective.webpackJsonp.../../../flex-layout/flexbox/api/flex.js.FlexDirective._onLayoutChange (flex.js:183)
at SafeSubscriber._next (flex.js:50)
at resolvePromise (zone.js:770)
at resolvePromise (zone.js:741)
at zone.js:818
at ZoneDelegate.webpackJsonp.../../../../zone.js/dist/zone.js.ZoneDelegate.invokeTask (zone.js:424)
at Object.onInvokeTask (core.es5.js:3881)
at ZoneDelegate.webpackJsonp.../../../../zone.js/dist/zone.js.ZoneDelegate.invokeTask (zone.js:423)
at Zone.webpackJsonp.../../../../zone.js/dist/zone.js.Zone.runTask (zone.js:191)
at drainMicroTaskQueue (zone.js:584)
at HTMLAnchorElement.ZoneTask.invoke (zone.js:490)

好吧，这显然与锚点有关，但是......不知道我是否遗漏了一些概念或什么，而且那里没有很多例子。

4

0 回答 0