4

如何将 angular 2 带入我现有的 symfony 2 项目中？所以我有一个子页面，我想在其中创建一个小的 angular 2 应用程序。我已将所有源代码存储到我的 acme bundle 公用文件夹中。我的子页面是/foo/bar，我的配置看起来像：

基本树枝模板：

{% block javascripts %}
{{ parent() }}

<!-- 1. Load libraries -->
<!-- IE required polyfills (from CDN), in this exact order -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/es6-shim/0.35.0/es6-shim.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/systemjs/0.19.16/system-polyfills.js"></script>
<script src="https://npmcdn.com/angular2/es6/dev/src/testing/shims_for_IE.js"></script>

<script src="https://code.angularjs.org/tools/system.js"></script>
<script src="https://code.angularjs.org/tools/typescript.js"></script>
<script src="https://code.angularjs.org/2.0.0-beta.13/angular2-polyfills.js"></script>
<script src="https://code.angularjs.org/2.0.0-beta.13/Rx.js"></script>
<script src="https://code.angularjs.org/2.0.0-beta.13/angular2.dev.js"></script>

<!-- 2. Configure SystemJS -->
<script>
    System.config({
        transpiler: 'typescript',
        typescriptOptions: {
            inlineSourceMap: true,
            emitDecoratorMetadata: true
        },
        packages: {
            'app': {
                defaultExtension: 'ts'
            }
        }
    });
    System.import({% block mainNgClass %}'/PATH/TO/MAIN.TS'{% endblock %})
            .then(null, console.error.bind(console));
</script>
{% endblock %}

延长树枝模板

{% block mainNgClass %} '{{ asset('bundles/acme/ListFlow/main.ts') }}' {% endblock %}

{% block content %}
    <list-flow>Loading...</list-flow>
{% endblock %}

我的简单“Hello world”应用程序按预期工作：
ListFLow.ts

import {Component} from 'angular2/core';

@Component({
    selector: 'list-flow',
    template: `<div>Hello world</div>`
})
export class ListFlow {

}

所以这里是我的问题：

  1. 我无法将 html-template 与相对路径链接templateUrl: ./../lala/doo.html-> 这是相对于我当前的位置 ( /foo/bar) 而不是相对于我的 *.ts 脚本？
  2. 我想添加第三方组件，例如Dragula（https://github.com/valor-software/ng2-dragula）->如何将其与作曲家链接并加载到前端？

  3. 如果我下载dragulalib 并将它自己放在我的公共捆绑文件夹中并像这样包含它

    import {DragulaService, Dragula} from "../../ng2-dragula/ng2-dragula";

@Component({
    selector: 'list-flow',
    directives: [Dragula],
    viewProviders: [DragulaService],

    我收到此错误：

    GET: .../foo/bar/dragula 404 未找到

因此，如果角度应用程序位于根路径之外，则会出现很多问题，处理此问题的最佳做法是什么？

4

0 回答 0