從 javascript 函數生成 django HTML URL

Question

我正在使用 Django 1.10.6 並嘗試從數據表中的 javascript 函數生成一個 url

在 url.py 下，我有一個名為 profile setup 的頁面，例如：

app_name = 'myapp'

urlpatterns = [
    url(r'^profile/(?P<pk>[0-9]+)/$', views.ProfileView.as_view(), name='profile'),
]

在 javascript 中，我有一個 django 查詢將數據發送到一個變量，數據顯示在一個帶有 name 和 id 字段的表上：

var django_dat =[
    {
        "id": 1,
        "name":       "Jack Spicer",
    },
    {
        "id":2,
        "name":       "Ted Cracker",
    }
    {
        "id":3,
        "name":       "Justin Rollin",
    }
    {
        "id":4,
        "name":       "Boaty Boat",
    }
];

$(document).ready(function() {
    var table = $('#dattable').DataTable({
        data: django_dat,
        columns: [{
          'data': null,
          'render': function(data, type, row, meta)  {
            //Django URL
            return '<a href={% url 'myapp:profile' 2 %}>' + data.name + '</a>';}},
             {
          data: 'id'
        }]
    });
});

我正在嘗試更改 URL，以便將名稱鏈接到像 {% url 'myapp:profile' data.id %} 這樣的 url。 上面的代碼被硬編碼為 id=2 並且有效。

嘗試將其更改為：

return '<a href={% url 'myapp:profile' '+ data.id+ ' %}>' + data.name + '</a>' 

但這給出了一個 No Reverse match error Reverse for 'profile' with arguments '('+ data.id+ ',)' and keyword arguments '{}' not found. 1 pattern(s) tried: ['profile/(?P<pk>[0-9]+)/$'] Reverse for 'profile' with arguments '('+ data.id+ ',)' and keyword arguments '{}' not found. 1 pattern(s) tried: ['profile/(?P<pk>[0-9]+)/$']

還嘗試使用替換功能：

return '<a href={% url 'myapp:profile' uid %}>'.replace('uid', data.id) +  data.name + '</a>'

但得到了同樣的錯誤

Answer 1

這不是技術問題，而是理解 Django 和 JavaScript 中 url 如何工作的問題。 請記住，模板 html 文件首先由 Django 解析和呈現。 Django 不關心 JavaScript 語法——它只是將其視為更多的文本。 一旦頁面被呈現，它就會被發送到瀏覽器，在那里它被解釋並運行 JavaScript。 當這個過程進行時，Django 完全不在畫面中。 瀏覽器永遠不會看到 Django 模板標簽。 所以這個過程有兩個不同的階段 - Django 模板渲染，然后是在瀏覽器中運行的 JavaScript。

當您使用 Django {% url %}標簽時，您是在要求 Django 解析和呈現一個 URL，它將使用其內置的 URL 解析器查找該 URL。 您的profile url 需要一個 id 變量，您收到的錯誤消息告訴您 Django 正在嘗試使用您提供的變量解析 url，但未能解析該 url - 這看起來是一個 JavaScript 字符串連接。 同樣，Django 不理解 JS，所以你實際上給了它一堆垃圾字符。

所以，讓你的{% url %}標簽工作的唯一方法是給它一個真實的用戶 ID，這是 Django 查找相關 URL 所需的。 但是在您的情況下，在您在 JavaScript 中選擇用戶之前，Django 不會知道該用戶 ID 是什么。

在 JavaScript 中獲取有效 url 的一些可能方法是：

1. 動態構建它（使用硬編碼 url 模式的字符串連接）。 使用此方法會失去可維護性，但它會是最快的實現方式。 如果您將來更改 url 結構，則必須記住回來並在此處更改它。
2. 最初從 Django 提供有效 url 列表，然后在選擇用戶時從該列表中進行選擇。 如果您的用戶列表很小，這將是一個很好的解決方案，並且可以避免對 url 進行硬編碼的問題。
3. 要擁有一個get_profile_url_for_user （或其他）API 端點，在 JS 中選擇用戶時，ajax 請求會與該用戶 ID 一起發送到通用 url，該 url 將在 Django 中進行 url 解析並返回該用戶個人資料的特定 url。 如果頁面上可能有數百個用戶，這將是我的首選方法。

編輯 - 3 年后回到這個話題 - 我想我在此期間學到了一些東西！ 還有第四個選項看起來好多了： 4. 假設您的用戶數據列表首先來自您的 Django 應用程序 - 您可以在該對象中包含每個用戶的個人資料 url，方法是在 Django 應用程序中的任何位置反轉 url用戶正在被序列化為 JSON。

{
    "id":4,
    "name": "Boaty Boat",
    "profile_url": "http://django-host/profile/4"
}

Answer 2

如果我理解正確，我想你可能只想這樣做：

return "<a href={% url 'myapp:profile' " + data.id + ' %}>' + data.name + '</a>' 

在您當前的表單中， myapp:profile將被解釋為 javascript 變量，因為您由於嵌套的單引號（並且它不是有效的 javascript 變量名稱）而未引用。

Answer 3

所以我嘗試了兩種使用 JavaScript 函數生成 URL 的解決方案：

function linkgen(app_page, link_id, display_txt){
    let tag_head ="<a href={% url '",
        tag_head2 =" %}>",
        tag_tail ='</a>'
    return tag_head.concat(app_page,"' ", link_id, tag_head2, display_txt, tag_tail )
}

function hardgen(app_page, link_id, display_txt){
    let tag_head ="<a href='http://localhost:8000/",
        tag_head2 ="/'>",
        tag_tail ='</a>'
    return tag_head.concat(app_page,"/", link_id, tag_head2, display_txt, tag_tail )
}

第一個生成 Django 樣式 {% URL link %} 第二個生成硬 http:// 鏈接。 硬鏈接工作正常。 但是你在做生產的時候一定要修改base url。

return hardgen('profile', data.id, data.name)

但是 django 生成的鏈接做了一些有趣的事情。

{ data: null, "render": function(data, type, row, meta) {
                console.log(linkgen('myapp:profile', data.id, data.name))
            return  linkgen('myapp:profile', data.id, data.name)
             ; }},

如果您將其粘貼到返回中，控制台日志將返回正確的鏈接，它將起作用，但由於 django 的設置方式，生成的字符串不會。