angular 2 を既存の symfony 2 プロジェクトに取り込むにはどうすればよいですか? 小さな角度2アプリを作成したいサブページがあります。すべてのソースを acme bundle public フォルダーに保存しました。私のサブページは/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 {
}
だからここに私の問題:
- html-template を相対パスにリンクする方法はありません
templateUrl: ./../lala/doo.html
-> これは現在の場所 (/foo/bar
) に対して相対的であり、*.ts スクリプトに対して相対的ではありませんか? Dragula
( https://github.com/valor-software/ng2-dragula )のようなサードパーティのコンポーネントを追加したい-> これをコンポーザーとリンクしてフロントエンドにロードするにはどうすればよいですか?libをダウンロードし
dragula
て、自分でパブリックバンドルフォルダーに入れ、次のように含める場合import {DragulaService, Dragula} from "../../ng2-dragula/ng2-dragula"; @Component({ selector: 'list-flow', directives: [Dragula], viewProviders: [DragulaService],
私はこのエラーが発生します:
GET: .../foo/bar/dragula 404 が見つかりません
角度のあるアプリがルートパスの外にある場合、非常に多くの問題があります。これを処理するためのベストプラクティスは何ですか?