小编Plo*_*ppy的帖子

我有关于 Angular (v4) 和外部 jQuery 插件的问题。我之前使用过这个 jQuery 插件，但使用的是 asp.net，而不是 Angular。我的 jQuery 插件由 3 个元素组成：

• 包含插件文件的文件夹（css、js 文件）
• 我需要在页面上添加的 Div 元素 ( <div id="mapsvg"></div>)
• 我需要在页面上添加并在页面加载时调用的 jQuery 函数 ( $('#mapsvg').mapSvg({source: '/maps/usa.svg'});)

我正在使用此站点的 jQuery 插件：http://mapsvg.com/documentation/jquery/

我的问题是如何将此插件添加到我的 Angular 项目中？我尝试在新的空白项目中执行此操作，但它不起作用。

此时此刻的我：

1. 在 angular.json 中添加了对脚本的引用 ->"./src/assets/mapsvg/js/mapsvg.js"
2. 在 app.component.ts 中声明变量 ->declare var $: any;
3. 将 div 元素添加到 app.component.html 中

现在，我在控制台中收到错误消息，提示找不到我的 usa.svg 文件 (404)。当我将 svg 文件移动到 src 文件夹中时，它会显示在页面上，但所有插件功能都不起作用。

有人可以帮我完成这个实施吗？

我从来没有让Angular Mobile Team的服务工作者正常工作,此时我想我忘了启用某些东西,因为它从最初发布以来就没有用过.即使它在我离线时在谷歌浏览器(智能手机和桌面)上安装并运行它也不再起作用,它也会在更新后随机崩溃.

没有关于如何设置它的文档.所以这就是我做的方式:

• ng new test-service-worker
• npm install @angular/service-worker
• 在.angular-cli.json,我补充说"serviceWorker": true
• npm build --prod,输出ngsw-manifest.json sw-register.b73048fe3d9f8a1e7ae5.bundle.j和worker-basic.min.js.所以一切似乎都好
• https://test-service-worker-97321.firebaseapp.com/ SW安装
• 如果我离线,等待一个小时让缓存过期(或者只是禁用缓存),我得到一个failed to load错误,无论我使用的是什么设备.

生成的dist目录:

生成的ngsw-manifest.json:

已安装并运行的服务工作者:可用的测试https://test-service-worker-97321.firebaseapp.com/

当我将chrome devtools选项设置为Offline并且Disable cache服务工作者不再加载内容时.它是如何工作的一个很好的例子是Twitter的,当他们的Web应用程序的工作原理Offline,并Disable cache进行检查.

注意:我之前与服务工作者创建了一些应用程序,并且他们在Chrome上正常工作.我不知道我在这里做错了什么.

我在Angular v4中有一个应用程序，它必须更改访问URL的scssdependong。例如：如果浏览器中的链接为“ example.com”，则该应用程序的背景色为：黑色；如果链接为“ example2.com”，则该应用程序的背景色为：红色

我有下一个问题：

当我转到C：\ Windows \ System32 \ drivers \ etc中的主机，并在主机中设置下一个配置127.0.0.1 example.com 127.0.0.1 example2.com

然后我使用“ example.com:4200”运行该应用程序，该应用程序未运行...浏览器向我显示此消息

“无效的主机头”

我该如何解决这个问题？

I have a working Angular project, and I have been given the work to carry forward the work. Since this is a small yet confusing problem for me, after a lot of research I have failed myself to get to the result.

In my project, we have used the moment in the app.component.ts, and used the code. The code is below

1. app.component.ts

import { Component, OnInit } from '@angular/core';
import { Router, NavigationEnd } from '@angular/router';
declare var …

我正在使用 Angular 开发 SPA。当按下历史后退按钮时，浏览器仅更改 Youtube iframe 而不是整个页面，我需要按两次后退按钮才能进入完整的上一页（第一次 URL 未更新）。仅当遵循涉及 YT iframe 元素的同一路线的 2 个链接时，才会发生这种情况。我需要保留历史导航，所以我不能只删除历史元素

Component
export class PlayerComponent implements OnInit {
  videoName: string;
  videoUrl: any;

  constructor(
    private sanitizer: DomSanitizer,
    private route: ActivatedRoute
  ) {}

  ngOnInit() {
    this.route.params.subscribe( params => {
      this.videoUrl = this.sanitizer.bypassSecurityTrustResourceUrl('https://www.youtube.com/embed/' + params.videoId);
    });
  }
}

HTML
<div class="embed-responsive embed-responsive-16by9">
  <iframe class="embed-responsive-item border border-primary" *ngIf="videoUrl"
    [src] = "videoUrl"
    allowfullscreen>
  </iframe>
</div>

我很久以前使用 Firebase 和 dialogflow-javascript-client 构建了一个应用程序。

现在，dialogflow-javascript-client 已弃用。由于 dialogflow-nodejs-client-v2 是一个 node.js 客户端，它不应该在 Angular 上运行。他们是否放弃了 javascript 支持？我无法从开发人员那里得到任何答案，他们似乎只是在回避它。

如果不可能，我唯一的解决方案是在我的应用程序中放弃对 Dialogflow 的支持。

对于从 Javascript 迁移的用户，绝对没有文档或信息，这是他们给您的唯一信息：

当然，我无论如何都尝试运行它，认为它也是为在 javascript 上运行而构建的......

但这是我得到的：

警告 ./node_modules/google-gax/node_modules/grpc/node_modules/node-pre-gyp/lib/util/versioning.js 17:20-67 关键依赖：依赖请求是一个表达式

./node_modules/google-gax/node_modules/grpc/node_modules/node-pre-gyp/lib/pre-binding.js 中的警告 20:22-48 关键依赖：依赖请求是一个表达式

./node_modules/google-gax/node_modules/grpc/src/grpc_extension.js 中的警告 32:12-33 关键依赖：依赖请求是一个表达式

./node_modules/google-gax/node_modules/grpc/node_modules/minimatch/minimatch.js 中的警告未找到模块：错误：无法解析“D:\ng\ww-app\node_modules\google-gax”中的“路径” \node_modules\grpc\node_modules\minimatch'

./node_modules/minimatch/minimatch.js 中的警告未找到模块：错误：无法解析“D:\ng\ww-app\node_modules\minimatch”中的“路径”

./node_modules/dialogflow/src/v2/agents_client.js 模块中的错误未找到：错误：无法解析 'D:\ng\ww-app\node_modules\dialogflow\src\v2' 中的 './agents_client_config'

....（更多后续）