标签: angular5

我正在使用Angular更新一个旧网站,我必须满足的一个要求是所有路由都应该保持原样(出于搜索引擎优化的目的).

很多老网站的路线完成以斜杠(像/my/route/),其中一些完成了.html,像/my/route.html.

问题是routerLink删除了每个路由中的最后一个斜线(斜线是我的路线/my/route).

如何routerLink保持尾随斜线？

这里可以看到一个很好的例子:AngularTrailingSlash.

构建angular5应用程序.该应用程序需要一些备用布局.

我的方法是处理主app模块路由文件中的高级路由.所述文件将路由映射到模块.对于非必要的速度驱动页面,模块将延迟加载,而不是为速度关键页面延迟加载:

app-layout-router.module.ts 文件:

import {NgModule} from '@angular/core';
import {PreloadAllModules, RouterModule, Routes} from '@angular/router';
import {PublicLayoutModule} from '@modules/layouts/public/public-layout.module';
import {AuthenticatedLayoutModule} from '@modules/layouts/authenticated/authenticated-layout.module';

const routes: Routes = [{
    path: '',
    loadChildren: () => PublicLayoutModule,
},{
    path: 'dashboard',
    loadChildren: () => AuthenticatedLayoutModule,
}];

@NgModule({
    imports: [RouterModule.forRoot(
        routes,
        {
            useHash: false,
            preloadingStrategy: PreloadAllModules
        }
    )],
    exports: [RouterModule],
})

export class AppLayoutRouter {
}

不在仪表板下的所有路线都将根据SEO原因进行预渲染.但是,在经过身份验证的布局中,我可以选择通过延迟加载后续模块来中断应用程序.例如,这是经过身份验证的模块路由器文件的内容:

import {NgModule} from '@angular/core';
import {RouterModule, Routes} from '@angular/router';
import {AuthenticatedLayoutComponent} from './authenticated-layout.component';

const routes: Routes = [{
    path: …

我正在从事基于角度的项目。我正在使用数据表来显示数据。当我尝试在表上进行一些修改时，出现以下错误。

DataTables警告：表ID = DataTables_Table_0-无法重新初始化DataTable。有关此错误的更多信息，请参见http://datatables.net/tn/3

我的角度通用项目中有多个组件。当我从home组件路由到其他组件时，我只会在页面源中获取home组件的内容。路由组件未更新它。

我已经通过服务器端的console.log检查了是否每个组件都在服务器端呈现，但是它只是加载主页，其他组件没有在服务器端呈现。

我使用npm run build：ssr进行构建，使用npm run serve：ssr进行服务器端服务。

在cmd或浏览器控制台中运行上述命令时，也没有错误。

有人可以帮忙吗？我在这个问题上停留了大约一个星期。

如果您需要有关该项目的其他信息，请告诉我。

Package.json

"dependencies": {
    "@agm/core": "^1.0.0-beta.2",
    "@angular/animations": "^5.2.0",
    "@angular/common": "^5.2.0",
    "@angular/compiler": "^5.2.0",
    "@angular/core": "^5.2.0",
    "@angular/forms": "^5.2.0",
    "@angular/http": "^5.2.0",
    "@angular/platform-browser": "^5.2.0",
    "@angular/platform-browser-dynamic": "^5.2.0",
    "@angular/platform-server": "^5.2.8",
    "@angular/router": "^5.2.0",
    "@ngu/carousel": "^1.4.8",
    "@nguniversal/express-engine": "^5.0.0-beta.6",
    "@nguniversal/module-map-ngfactory-loader": "^5.0.0-beta.6",
    "bootstrap": "^3.3.7",
    "core-js": "^2.4.1",
    "hammerjs": "^2.0.8",
    "ng2-nouislider": "^1.7.7",
    "ngx-bootstrap": "^2.0.0-beta.8",
    "nouislider": "^11.0.3",
    "reflect-metadata": "^0.1.12",
    "rxjs": "^5.5.6",
    "ts-loader": "^3.5.0",
    "zone.js": "^0.8.19"
  },
  "devDependencies": {
    "@angular/cli": "~1.7.3",
    "@angular/compiler-cli": "^5.2.0",
    "@angular/language-service": "^5.2.0",
    "@types/jasmine": "~2.8.3",
    "@types/jasminewd2": "~2.0.2",
    "@types/node": "~6.0.60", …

我想知道是否有可能以模糊的反应形式进行验证。目前，您可以进行设置，updateOn: "blur"但是输入字段的值不会在输入时更新。在我的情况下，我需要在每次击键时更新值，因为我会用它进行计算并将结果显示给用户。验证应仅在模糊时进行。

谢谢。

编辑：

我使用FormBuilder，一些内置的验证器和一些自定义的验证器。示例代码：

let formToMake = {
  purpose: [null, Validators.required],
  registrationDate: this.fb.group({
    day: [null, Validators.required],
    month: [null, Validators.required],
    year: [null, Validators.required]
  }),
  isTruth: [null, Validators.compose([checkIfTrue, Validators.required])]
};

如果我要使用模糊事件，则需要手动进行所有验证，但我认为这不是一个好方法。

ag-grid提供了一种使用api.getSelectedRows()函数获取选定行的方法。并提供一种使用api.setRowData([])功能设置所有行的方法。我正在寻找某种东西getAllRows()来返回网格中的所有行。我知道有一种方法可以使用api.forEachNode()etc 遍历所有行。有什么办法可以获取整个行数组？

我正在使用带有ag-grid数据表的角度5，我无法使用cellRenderer从单元格触发点击事件，这里如何使用我的ag-grid-> colDefs

this.columnDefs = [
            {headerName: '#', rowDrag: true, width: 75},
            {headerName: 'One', field: 'fieldName',
                cellRenderer : function(params){
                    return '<div><button (click)="drop()">Click</button></div>'
                }
            }
];

drop() {
    alert("BUTTON CLICKEFD")
}

如果正在使用 onClick="alert("123")" ->它有效，但是我无法使用onClick="drop()"它会抛出未定义的信息，

我也在cellRenderer内部尝试过-> params = params.$scope.drop = this.drop;

如果在使用gridOptions angularCompileRows : true时抛出错误，Cannot read property '$apply' of undefined. 是否需要安装ag-grid enterprise？

我的AlertService有 private subject = new Subject<Alert>();。我想在5秒钟后专心清除警报。我可以这样使用setTimeout()：

autoClear(alertId?: string) {
   setTimeout(
      () => this.subject.next(new Alert({alertId})),
   5000);
  }

我尝试使它更优雅，并创建了以下代码：

autoClear(alertId?: string) {
    const delay = new Observable(x => {
      x.next();
    }).delay(5000).subscribe(() => {
      this.subject.next(new Alert({alertId}));
      delay.unsubscribe();
    });
  }

这两个示例都可以工作，但看起来不像是使用RxJS的正确方法。我该如何改善？

我单击关闭通知时收到此错误，它似乎是随机发生的。

zone.js：196未捕获的错误：ViewDestroyedError：尝试使用被破坏的视图：在checkAndUpdateView（core.js：13508）在Object.debugUpdateDirectives [作为updateDirectives]（core.js：14336）的viewDestroyedError（core.js：9540）的detectChanges ），位于Object.debugCheckAndUpdateView的callWithDebugContext（core.js：14740）[以checkRef.webpackJsonp ../ node_modules/@angular/core/esm5/core.js.ViewRef_.detectChanges（core的checkAndUpdateView]（core.js：14277） .js：11300），位于Angular2-notifications.umd.js：531，位于ZoneDelegate.webpackJsonp ../ node_modules / zone.js / dist / zone.js.ZoneDelegate.invoke（zone.js：392），位于Object.onInvoke（核心.js：4629）在ZoneDelegate.webpackJsonp ../ node_modules / zone.js / dist / zone.js.ZoneDelegate.invoke（zone.js：391）

此错误在我的应用程序中多次（appx 1667次）命中，因为它执行更改检测生命周期挂钩。

如果有人有想法解决此问题，请帮助我解决这个问题。

Angular2-通知