小编Tom*_*omP的帖子

我正在尝试为我的ngrx状态管理器实现Effects.目前我正在使用Angular v5.2.1,ngrx v4.1.1和rxjs v5.5.6.我试过"老"的方法

@Effect() login$: Observable<Action> = this.actions$.ofType('LOGIN')
.mergeMap(action =>
  this.http.post('/auth', action.payload)
    // If successful, dispatch success action with result
    .map(data => ({ type: 'LOGIN_SUCCESS', payload: data }))
    // If request fails, dispatch failed action
    .catch(() => of({ type: 'LOGIN_FAILED' }))
);

但我收到了一个错误 Property 'mergeMap' does not exist on type 'Actions<Action>'.所以我用了新pipe方法.问题是当我尝试导入ofType运算符时

// ...
import { Action } from '@ngrx/store';
import { Effect, Actions, ofType } from '@ngrx/effects';

import …

我正在尝试制作可重复使用的材料表，并且我想使用TemplateRefwithngTemplateOutlet来生成列。在这个例子中，我创建了cards使用我的material-table组件的组件。在cards.component.html我有我的表格列之一的模板。运行该项目将导致错误ERROR TypeError: Cannot read property 'template' of undefined（请参阅 上的控制台stackblitz）。是否可以将 columnt 模板传递给我MaterialTableComponent并使用它来定义列？

 <table mat-table [dataSource]="data" class="mat-elevation-z4">
  <ng-container
    *ngFor="let column of displayedColumnObjects"
    [matColumnDef]="column.id"
  >
  <!-- if where is cellTemplate in table config json, use cellTemplate  -->
    <ng-container
      *ngIf="column.cellTemplate" 
      [ngTemplateOutlet]="column.cellTemplate"
    >
    </ng-container>

    <ng-container *ngIf="!column.cellTemplate">
      <th mat-header-cell *matHeaderCellDef> {{column.title}} </th>
      <td mat-cell *matCellDef="let element"> {{element[column.id]}} </td>
    </ng-container>

  </ng-container>

  <tr mat-header-row *matHeaderRowDef="columnsToDisplay"></tr>
  <tr mat-row *matRowDef="let row; columns: …

升级到Angular 5和Cli 1.5后,ng serve我收到一个错误:

ERROR in ./node_modules/@stomp/ng2-stompjs/index.ts
    Module build failed: Error: ...\project\node_modules\@stomp\ng2-stompjs\index.ts is not part of the compilation output. Please check the other error messages for details.
        at AngularCompilerPlugin.getCompiledFile (...\project\node_modules\@ngtools\webpack\src\angular_compiler_plugin.js:629:23)
        at plugin.done.then (...\project\node_modules\@ngtools\webpack\src\loader.js:467:39)
        at <anonymous>
        at process._tickCallback (internal/process/next_tick.js:188:7)
     @ ./src/app/app.module.ts 27:0-63
     @ ./src/main.ts
     @ multi webpack-dev-server/client?http://0.0.0.0:0 ./src/main.ts

我试图添加include到我的tsconfig.app.json所以它看起来像这样:

{
  "extends": "../tsconfig.json",
  "compilerOptions": {
    "outDir": "../out-tsc/app",
    "module": "es2015",
    "baseUrl": "",
    "types": []
  },
  "include": [
    "../node_modules/@stomp/**/*.ts"
  ],
  "exclude": [
    "test.ts",
    "**/*.spec.ts"
  ]
}

我试过重新运行ng …

我正在尝试@Effect()为我的操作创建一个。当我使用 type 运行 action 时，AuthenticationUserLoad出现错误。

ERROR Error: Effect "AuthenticationEffects.getUser$" dispatched an invalid action: [object Object]

这是我的Effect代码

    @Effect()
      getUser$ = this.actions$.pipe(
       ofType(AuthenticationUserActions.AuthenticationUserTypes.AuthenticationUserLoad),
       map((action) => {

          return this.authService.getUser().pipe(
            map((user: User) => new AuthenticationUserActions.AuthenticationUserLoadSuccess({user})),
            catchError(error => of(new AuthenticationUserActions.AuthenticationUserLoadFailure({error})))

          );
        })
     );

更新

我改变map了switchMap，它的工作原理。

 @Effect()
  getUser$ = this.actions$.pipe(
    ofType(AuthenticationUserActions.AuthenticationUserTypes.AuthenticationUserLoad),
    switchMap((action) => {

      return this.authService.getUser().pipe(
        map((user: User) => new AuthenticationUserActions.AuthenticationUserLoadSuccess({user})),
        catchError(error => of(new AuthenticationUserActions.AuthenticationUserLoadFailure({error})))
      );
    })
  );

也许我不明白 map 和 switchMap 之间的区别。

我试图围绕SVG文本制作SVG矩形.当我想使用.width()或.height()使用SVG文本时,Chrome会返回我的预期,但Firefox不会.这是我制作的jsfiddle demo的链接.

$(document).ready(function(){
    var $rect = $(document.createElementNS('http://www.w3.org/2000/svg', 'rect'));
    var x = 50;
    var y = 50;
    var fontSize = 10;
    $rect.attr({
        'x' : x,
        'y' : y,
        'stroke' : 'black',
        'stroke-width' : 1,
        'fill' : 'white'
    });
    $rect.appendTo($("#svgArea"));

    var $svgText = $(document.createElementNS('http://www.w3.org/2000/svg', 'text'));
    $svgText.attr({
        'x': x,
        'y': y,
        'font-family' : 'verdana',
        'font-weight': 'bold',
        'font-size' : fontSize
    });

    var node = document.createTextNode("Lorem Ipsum");
    $svgText.append(node);
    $svgText.appendTo($("#svgArea"));

    var textWidth = $svgText.width();
    var textHeight = $svgText.height();

    $rect.attr({
        'x': x, …

我试图用sidemenu制作UWP应用程序.当我尝试本教程时,我在XAML中收到错误:

NavigationView is not supported in a windows universal project

构建选项:

Target Version:   Win 10 Creators Update (10.0; Build 15063)
Minimum Version:  November Update (10.0' Build 10586)

我正在使用角材料选项卡，我想使用指令动态隐藏选项卡元素。

html模板

<mat-tab-group>
  <!-- how to hide this using directive? -->
  <mat-tab appHideMe label="First"> Content 1 </mat-tab>
  <!-- like this -->
  <mat-tab *ngIf="false" label="Second"> Content 2 </mat-tab>
  <mat-tab label="Third"> Content 3 </mat-tab>
</mat-tab-group>

<div appHideMe>
  hidden
</div>
<div>
  visible
</div>

HideMe 指示

<mat-tab-group>
  <!-- how to hide this using directive? -->
  <mat-tab appHideMe label="First"> Content 1 </mat-tab>
  <!-- like this -->
  <mat-tab *ngIf="false" label="Second"> Content 2 </mat-tab>
  <mat-tab label="Third"> Content 3 </mat-tab>
</mat-tab-group>

<div appHideMe>
  hidden
</div>
<div>
  visible
</div> …

最近我打开我的谷歌的幻灯片脚本运行时间从Rhino到V8。我测试了我的附加组件，但出现错误：

We're sorry, a server error occurred while reading from storage. Error code PERMISSION_DENIED.

我的脚本使用PropertiesService.getUserProperties(). 我发现我必须从我的 google 帐户注销并再次登录并且它起作用了。

我可以想象这对于使用此附加组件的其他用户来说也可能是痛苦的。有没有其他方法可以解决此错误？

appscript.json 配置

{
  "timeZone": "Europe/Bratislava",
  "runtimeVersion": "V8",
  "dependencies": {
  },
  "exceptionLogging": "STACKDRIVER"
}

此外，我正在我的 PC nad 上开发本地附加组件，使用clasp将代码推送到 App 脚本。

更新

我创建了最小的项目来重现这个错误，我发现这PropertiesService.getUserProperties()不是问题。事实证明，从Rhinoto切换后V8，我无法调用任何 appscript 函数。

// Code.gs
function onInstall(event) {
    onOpen(event);
}

function onOpen(event) {
    SlidesApp.getUi().createAddonMenu()
        .addItem('Open the sidebar', '_showSidebar')
        .addToUi();
    _showSidebar();
}

function _showSidebar() { …

在我的函数中，我想读取一个文本文件。如果文件不存在，则会创建该文件。我想使用相对路径，因此如果我有 .jar，文件将在完全相同的目录中创建。我已经尝试过这个。这是我的函数，变量fName设置为test.txt

    private static String readFile(String fName) {
    String noDiacText;
    StringBuilder sb = new StringBuilder();
    try {
        File f = new File(fName, "UTF8");
        if(!f.exists()){
            f.getParentFile().mkdirs();
            f.createNewFile();
        }

        FileReader reader = new FileReader(fName);
        BufferedReader bufferedReader = new BufferedReader(new InputStreamReader(new FileInputStream(fName), "UTF8"));

        String line;

        while ((line = bufferedReader.readLine()) != null) {
            sb.append(line);

        }
        reader.close();

    } catch (IOException e) {
        e.printStackTrace();
    }


    return sb.toString();
}

我收到一个错误，f.createNewFile();它说

java.io.IOException:  System cannot find the path specified
at java.io.WinNTFileSystem.createFileExclusively(Native Method) …

我尝试将自定义CSS附加到ngx-datatable单元格。

<ngx-datatable-column 
  *ngFor="let column of tableOptions.columnDefs"
  [cellClass]="'my-custom-cell'"
  ...

的CSS my-custom-cell：

.my-custom-cell{
  padding: 0;
}

在开发工具中，我可以看到datatable-body-cell有类

class="datatable-body-cell my-custom-cell sort-active"

问题是没有css被覆盖

我想举一个简单的例子来说明香草ES导入导出。

index.js

<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8" />
  <script type="module" src="main.js"></script>
</head>
<body>

</body>
</html>

main.js

import {foo} from './mathModule';

console.log(foo);

mathModule.js

export const foo = Math.sqrt(2);

当我运行此页面时，出现错误

main.js:1 GET http://[page].net/test/mathModule 404 (Not Found)

编辑：项目结构

• 测试
  • index.html
  • main.js
  • mathModule.js

我想确定鼠标点击点是否位于SVG折线上.我找到了这个Python代码来确定一个点是否位于另外两个点之间,并在JavaScript中重新实现它.

function isOnLine(xp, yp, x1, y1, x2, y2){

    var p = new Point(x, y);
    var epsilon = 0.01;

    var crossProduct = (yp - y1) * (x2 - x1) - (xp - x1) * (y2 - y1);
    if(Math.abs(crossProduct) > epsilon)
        return false;
    var dotProduct = (xp - x1) * (x2 - x1) + (yp - y1)*(y2 - y1);
    if(dotProduct < 0)
        return false;
    var squaredLengthBA = (x2 - x1)*(x2 - x1) + (y2 - y1)*(y2 - y1);
    if(dotProduct > …

将 ngx-datatable 从 升级到 后，v11.0.4出现v11.1.5错误。

 ERROR TypeError: Cannot read property 'length' of null
    at DatatableComponent.get [as allRowsSelected] (index.js:4867)
    at Object.eval [as updateDirectives] (DatatableComponent.html:18)
    at Object.debugUpdateDirectives [as updateDirectives] (core.js:14689)
    at checkAndUpdateView (core.js:13836)
    at callViewAction (core.js:14187)
    at execEmbeddedViewsAction (core.js:14145)
    at checkAndUpdateView (core.js:13837)
    at callViewAction (core.js:14187)
    at execComponentViewsAction (core.js:14119)
    at checkAndUpdateView (core.js:13842)

我尝试降级到v11.1.0但同样的问题。我的表定义如下所示：

 <ngx-datatable
  fxFlexFill
  #table
  class="material striped"
  [rows]="rows | async"
  [columnMode]="'force'"
  [scrollbarV]="true"
  [scrollbarH]="true"
  [headerHeight]="headerHeight"
  [footerHeight]="50"
  [rowHeight]="rowHeight"
  (scroll)="onScroll($event)"
  [selectionType]="'single'"
  >

数据是异步的，因此表在 init 上没有数据。有任何想法吗？