Question

使用角度2.添加ng-lighning到我的种子项目。我将CDN添加到index.html，然后将该组件包含在引导文件中。该页面显示与系绳有关的错误......关于我做错什么的任何想法或建议

的index.html：

  <!-- 2. Configure SystemJS -->
    <script src="systemjs.config.js"></script>
    <script src="https://npmcdn.com/ng-lightning@0.8.0/ng-lightning.bundle.js"></script>

BOOT.ts

import { bootstrap } from '@angular/platform-browser-dynamic';
import { ROUTER_PROVIDERS } from "@angular/router";
import { LocationStrategy, HashLocationStrategy } from "@angular/common";
import { provide } from "@angular/core";

import { AppComponent } from "./app.component";
import { MessageService } from "./messages/message.service";
import {provideNglConfig} from 'ng-lightning/ng-lightning';

bootstrap(AppComponent, [MessageService,
  ROUTER_PROVIDERS,
  provide(LocationStrategy, {useClass: HashLocationStrategy}),
  provideNglConfig()

]);

错误

"NetworkError: 404 Not Found - http://localhost:3000/tether"
tether
Error: patchProperty/desc.set/wrapFn@http://localhost:3000/js/vendor/zone.js/dist/zone.js:769:27
    Zone</ZoneDelegate</ZoneDelegate.prototype.invokeTask@http://localhost:3000/js/vendor/zone.js/dist/zone.js:356:24
    Zone</Zone</Zone.prototype.runTask@http://localhost:3000/js/vendor/zone.js/dist/zone.js:256:29
    ZoneTask/this.invoke@http://localhost:3000/js/vendor/zone.js/dist/zone.js:423:29

    Error loading http://localhost:3000/tether as "tether" from http://localhost:3000/ng-lightning/popovers/trigger

Answer 1

由于您使用的是SystemJS，因此您还应在systemjs.config.js中配置cdn for tether的路径。像这样的东西： paths: { 'tether': 'https://cdnjs.cloudflare.com/ajax/libs/tether/1.2.0/js/tether.js', }

我希望这会有所帮助： - ）

Answer 2

我也遇到了同样的问题。

修复

编辑systemjs.config.js文件并添加以下内容。您可能在这些结构中有其他条目，因此只需将它们添加为新行。

var map = {
    'tether':                     'node_modules/tether/dist/js',
  };

var packages = {
    'tether': { main: 'tether.js', defaultExtension: 'js' },
  };

var ngPackageNames = [
    'tether',
  ];

原始问题

只要将provideNglConfig（）加载到我的bootstrap命令中，我就会看到以下错误。

我的引导程序文件非常简单：

import { bootstrap }    from '@angular/platform-browser-dynamic';
import { AppComponent } from './app.component';
import { HTTP_PROVIDERS } from '@angular/http';
import { APP_ROUTER_PROVIDERS } from './app.routes';
import {provideNglConfig} from 'ng-lightning/ng-lightning';

bootstrap(AppComponent, [ HTTP_PROVIDERS, APP_ROUTER_PROVIDERS, provideNglConfig() ]);

如果我将NGL_DIRECTIVES添加到指令中，也会在组件上发生这种情况。

import { NGL_DIRECTIVES } from 'ng-lightning/ng-lightning';
directives: [ AppHeaderComponent, NGL_DIRECTIVES ]

在这两种情况下，如果我将import语句留在那里，但取出上面提到的组件，一切都可以正常工作。

login:41 Error: (SystemJS) Error: XHR error (404 Not Found) loading 
http://localhost:3000/tether(…)(anonymous function) @ login:41ZoneDelegate.invoke @ zone.js:323Zone.run @ zone.js:216(anonymous function) @ zone.js:571ZoneDelegate.invokeTask @ zone.js:356Zone.runTask @ zone.js:256drainMicroTaskQueue @ zone.js:474ZoneTask.invoke @ zone.js:426
zone.js:101 GET http://localhost:3000/tether 404 (Not Found)scheduleTask @ zone.js:101ZoneDelegate.scheduleTask @ zone.js:336Zone.scheduleMacroTask @ zone.js:273(anonymous function) @ zone.js:122send @ VM35636:3fetchTextFromURL @ system.src.js:1059(anonymous function) @ system.src.js:1767ZoneAwarePromise @ zone.js:584(anonymous function) @ system.src.js:1766(anonymous function) @ system.src.js:2795(anonymous function) @ system.src.js:3365(anonymous function) @ system.src.js:3677(anonymous function) @ system.src.js:4069(anonymous function) @ system.src.js:4532(anonymous function) @ system.src.js:4801(anonymous function) @ system.src.js:413ZoneDelegate.invoke @ zone.js:323Zone.run @ zone.js:216(anonymous function) @ zone.js:571ZoneDelegate.invokeTask @ zone.js:356Zone.runTask @ zone.js:256drainMicroTaskQueue @ zone.js:474ZoneTask.invoke @ zone.js:426

zone.js:101 GET http://localhost:3000/tether 404 (Not Found)scheduleTask @ zone.js:101ZoneDelegate.scheduleTask @ zone.js:336Zone.scheduleMacroTask @ zone.js:273(anonymous function) @ zone.js:122send @ VM35636:3fetchTextFromURL @ system.src.js:1059(anonymous function) @ system.src.js:1767ZoneAwarePromise @ zone.js:584(anonymous function) @ system.src.js:1766(anonymous function) @ system.src.js:2795(anonymous function) @ system.src.js:3365(anonymous function) @ system.src.js:3677(anonymous function) @ system.src.js:4069(anonymous function) @ system.src.js:4532(anonymous function) @ system.src.js:4801(anonymous function) @ system.src.js:413ZoneDelegate.invoke @ zone.js:323Zone.run @ zone.js:216(anonymous function) @ zone.js:571ZoneDelegate.invokeTask @ zone.js:356Zone.runTask @ zone.js:256drainMicroTaskQueue @ zone.js:474ZoneTask.invoke @ zone.js:426

对组件使用ng-lightning显示404系绳错误

2 个答案:

修复

原始问题