标签: angular5

我添加了ng-idle/keepalive.

这是我的package.json档案

{
    "name": "azimuth",
    "version": "1.1.0",
    "license": "MIT",
    "scripts": {
        "ng": "ng",
        "start": "ng serve",
        "build": "ng build",
        "test": "ng test",
        "lint": "ng lint",
        "e2e": "ng e2e",
        "install": "napa"
    },
    "private": true,
    "dependencies": {
        "@angular/animations": "4.3.3",
        "@angular/common": "4.3.1",
        "@angular/compiler": "4.3.1",
        "@angular/core": "4.3.1",
        "@angular/forms": "4.3.1",
        "@angular/platform-browser": "4.3.1",
        "@angular/platform-browser-dynamic": "4.3.1",
        "@angular/router": "4.3.1",
        "@ng-idle/core": "^2.0.0-beta.13",
        "@ng-idle/keepalive": "^2.0.0-beta.13",
        "angular2-datatable": "0.6.0",
        "angular2-froala-wysiwyg": "2.5.1-2",
        "angular2-google-maps": "0.17.0",
        "angular2-google-place": "^2.0.2",
        "angular2-moment": "^1.7.0",
        "angular2-text-mask": "^8.0.3",
        "awesome-bootstrap-checkbox": "1.0.0-alpha.4",
        "bootstrap": "4.0.0-alpha.6",
        "chart.js": "2.5.0",
        "core-js": "2.4.1",
        "d3": …

给定动态网址列表，我无法从YouTube加载一些iframe视频。

我有这个HTML：

<div fxLayout="column">

  <div *ngFor="let v of videos">
    <div fxLayout="row">
      <div>
        Type: {{v.type}}
      </div>
      <div>
        <iframe width="420" height="315"
                [src]="getVideoURL(v)">
        </iframe>
      </div>
    </div>

  </div>

</div>

这是我的Angular代码：

import { Component, OnInit } from '@angular/core';
import {DomSanitizer} from '@angular/platform-browser';

@Component({
  templateUrl: './docs.component.html',
  styleUrls: ['./docs.component.scss']
})
export class DocsComponent implements OnInit {

  videos = [
    {type:'installation', val:'https://www.youtube.com/embed/tgbNymZ7vqY'},
    {type:'usage', val: 'https://www.youtube.com/watch?v=ahla7JgpDEE'},
    {type:'keyboard shortcuts',val:'https://www.youtube.com/watch?v=bVYXWVs0Prc'}
    ];

  constructor(private sanitizer: DomSanitizer) {

  }

  ngOnInit() {
  }

  getVideoURL(v: any){
    return this.sanitizer.bypassSecurityTrustUrl(v.val)
  }
}

我收到此错误：

错误：需要一个安全的ResourceURL，并有一个URL

有人知道如何解决此错误吗？

我正在开发一个php和angular 5项目,我需要知道如何加密网络选项卡中显示的响应.我们可以加密它,以便用户无法读取任何响应吗？

我正在使用打字稿（Angular 5）并且我有以下代码：

let date = new Date(2018, 8, 17, 14, 0);

我希望结果是“2018 年 8 月 17 日星期五 14:00:00 GMT-0400（东部夏令时间）”，但实际上返回的是这样的：

2018 年 9 月 17 日星期一 14:00:00 GMT-0400（东部夏令时间）

如您所见，它为日期增加了一个月。我已经通过如下代码减去来修复它：

let date = new Date(2018, 8 - 1, 17, 14, 0);

我的问题是为什么会发生这种情况？任何的想法？有没有其他方法可以解决这个问题？

我循环我的数据列表，并在span中显示在视图中：

 <span  *ngFor="let d of myData"> {{d.name}} ,</span>

如您所见，我在每个项目的末尾添加逗号' ， '以获取一致的视图

这导致我的外观如下：

AAA,BBB,CCC,DDD,

我的问题是**我要自动删除的最后一个逗号。

建议？

您好，我在编译项目时遇到错误。我正在使用 Angular 5 和 TypeScript。

我正在从项目根文件夹提供 npm run build ，以下是我收到的错误。

bash-4.2$ npm run build
> primecast@5.0.1 build /tmp/tester001/mep-private/ui
> ng build --prod

 10% building modules 3/4 modules 1 active ...ter001/mep-private/ui/src/styles.scssNode#moveTo was deprecated. Use Container#append.
Date: 2019-12-20T11:17:00.575Z                                                     
Hash: 175df3f370fd7976d3c4
Time: 16261ms
chunk {0} styles.bb4ae0c2b0dd75fdc7ee.bundle.css (styles) 159 kB [initial] [rendered]
chunk {1} polyfills.3bc34265385d52184eab.bundle.js (polyfills) 86 bytes [initial] [rendered]
chunk {2} main.e402deade8b026b7d50e.bundle.js (main) 84 bytes [initial] [rendered]
chunk {3} inline.9d07561b59257af76b95.bundle.js (inline) 1.45 kB [entry] [rendered]

ERROR in src/app/accounts/account-service-provider-clients/account-service-provider-clients.component.html(17,28): : Property 'controls' does not …

我无法在我的 mat-select 中使用 formControl。

我将从文件中删除所有不必要的数据。

这是我的 package.json

"dependencies": {
  "@angular/cdk": "5.0.4",
  "@angular/common": "~5.2.0",
  "@angular/compiler": "~5.2.0",
  "@angular/core": "~5.2.0",
  "@angular/flex-layout": "2.0.0-beta.12",
  "@angular/forms": "~5.2.0",
  "@angular/material": "5.0.4"
}

文件夹结构：

-src
  -app
    -myComponent
      -myComponent.component.html
      -myComponent.component.ts
      -myCompnent.module.ts
    -shared
      -material
         -material.module.ts
      -shared.module.ts

material.module.ts：

import { FormsModule } from '@angular/forms';
import { MatSelectModule } from '@angular/material';


@NgModule({
 providers: [],
 imports: [
    FormsModule
 ],
 exports: [
   MatSelectModule
 ]
})
 export class CustomMaterialModule {
}

共享模块.ts

import { CustomMaterialModule } from './material/material.module';

@NgModule({
  exports: [
    CustomMaterialModule
  ],
  declarations: []
}) …

有人可以帮忙吗

所以我使用@ ngx-pwa将登录数据存储在名为login的本地存储密钥中

在这里,我正在尝试获取此数据并显示它但我未定义!

public customerProfile

ngOnInit() {
 this.getProfileData();
 console.log(this.cutomerProfile) //shows undefined
}

getProfileData() {
 this.localStorage.getItem('login').subscribe((login) => {
   this.customerProfile = login;
   console.log(this.customerProfile.user) //shows login data
 })
}

我是 Angular 开发的初学者。现在在我的组件中使用 *ngIf 语句。

在搜索时，我发现建议不要在 *ngIf 语句中使用逻辑的文章。

示例1：

<user-component *ngIf="role==='user'"></user-component><guest-component *ngIf="role==='guest'"></guest-component> and so on

示例2：

<div [ngSwitch]="typeOfUser"><user-component *ngSwitchCase="user"></user-component><guest-component *ngSwitchCase="guest"></guest-component><default-component *ngSwitchDefault></default-component></div>

我如何使用这些语句来实现更清洁和高性能的角度应用程序。

附上免费代码营的参考文章， 干净且高性能的 Angular 应用程序的最佳实践

我正在使用Angular 5.2.3和Laravel 5.4创建一个应用程序.我想知道角度版本是否稳定,以便我可以继续.我从搜索中得到了不同的答案.请帮帮我.

Angular CLI:1.6.7节点:8.9.4 OS:win32 x64 Angular:5.2.3

我没有得到所需的输出为20.

这有什么问题？

{{x = 4*5}}