如何使用Django内置的webserver服务Angular2

时间:2017-10-09 14:52:20

标签: django angular django-templates

如何使用Django内置网络服务器提供Angular2应用程序? 我想我在django的模板和静态路径方面遇到了一些问题。

我的django项目结构如下:

DjangoDir/
   manage.py
   project/
      settings.py
      urls.py
   app1/
   app2/
      static/
          app2/
              something.js
              something.css
      templates/
          app2/
              index.html
      urls.py
      views.py

我有一个带有以下索引的angular2应用程序:

<!doctype html>
<html lang="en">
    <head>
        <meta charset="utf-8">
        <title>Angular2</title>
        <base href="/">
        <link href="something.css" rel="stylesheet"/>
    </head>
    <body>
        <app-root></app-root><script type="text/javascript" src="something.js"></script>
    </body>
</html>

我获取了something.js和something.css文件的HTTP Status 404(Not Found)代码。有什么想法吗?

这是我在app2中的views.py。

from django.shortcuts import render

# Create your views here.
def index(request):

    return render(request, 'app2/index.html')

更新

工作解决方案,但仍在寻找替代方案。 添加到angular2 app中的所有内部链接:

"/static/app2/"

<!--e.g.:-->
<script type="text/javascript" src="/static/app2/something.js"></script>

or
<!--{% load static %}-->
<script type="text/javascript" src="{% static 'app2/something.js' %}"></script>"

如何避免更改模板和静态文件中的每个链接只是为了让angular2应用程序与django一起使用?

1 个答案:

答案 0 :(得分:1)

我认为处理Django和Angular 2+的更好方法是构建API。您可以使用Django REST Framework或Tastypie创建RESTful API。然后,您的Angular2应用程序将使用该API来创建面向用户的体验。您可以查看django-rest-angular2-example

但是,您想要管理静态文件,可以阅读Managing static files