Img標籤裏面的窗體不工作

Question

嗨我想顯示在使用Jade的窗體內的段落內的圖像。錯誤指向p標籤。當我不包含圖像時，p標籤按預期工作。這導致我相信它是導致錯誤的img標籤。我可以在表單中添加一個img標籤嗎？如果我在「更新」按鈕下面的表單外部添加圖像，它將起作用。出於美學原因，我試圖在窗體中顯示圖像。

這裏是代碼的無圖像的副本正常運行：

3 block content 
    4  h1. 
    5  News Article ID #{newsarticle._id} 
    6  form(action='/newsarticles/#{newsarticle._id}/edit',method='post',name='updatenewsarticle',enctype='multipart/form-data') 
    7  p Title: 
    8   input(type='text', value='#{newsarticle.articletitle}', name='articletitle') 
    9  p Text for News Article: 
    10   textarea(rows="5", cols="40", name='bodytext') #{newsarticle.bodytext} 
    11  p Current Image: 
    12  p Update News Article Image: 
    13   input(type="file" name="profpic") 
    14  p 
    15   button#btnSubmit(type='submit'). 
    16    Update 

這裏就是我想要的圖像插入到當前的圖像段第12行代碼的副本：

3 block content 
    4  h1. 
    5  News Article ID #{newsarticle._id} 
    6  form(action='/newsarticles/#{newsarticle._id}/edit',method='post',name='updatenewsarticle',enctype='multipart/form-data') 
    7  p Title: 
    8   input(type='text', value='#{newsarticle.articletitle}', name='articletitle') 
    9  p Text for News Article: 
    10   textarea(rows="5", cols="40", name='bodytext') #{newsarticle.bodytext} 
    11  p Current Image: 
    12   img(src='#{newsarticle.imgurl}') 
    13  p Update News Article Image: 
    14   input(type="file" name="profpic") 
    15  p 
    16   button#btnSubmit(type='submit'). 
    17    Update 

這是當我嘗試插入圖像時它正在拋出的錯誤日誌。它是指向第11行錯誤是意外的文本號碼：

 9|  p Text for News Article: 
    10|   textarea(rows="5", cols="40", name='bodytext') #{newsarticle.bodytext} 
    > 11|  p Current Image: 
    12|   img(src='#{newsarticle.imgurl}')  
    13|  p Update News Article Image: 
    14|   input#inputProfPic(type="file" name="profpic") 

    unexpected text 
     p 

我自己也嘗試了該段移除圖像，只是把它當前的圖像之下：第12行文字如下，但它仍然拋出幾乎相同的錯誤如上：

3 block content 
    4  h1. 
    5  News Article ID #{newsarticle._id} 
    6  form(action='/newsarticles/#{newsarticle._id}/edit',method='post',name='updatenewsarticle',enctype='multipart/form-data') 
    7  p Title: 
    8   input(type='text', value='#{newsarticle.articletitle}', name='articletitle') 
    9  p Text for News Article: 
    10   textarea(rows="5", cols="40", name='bodytext') #{newsarticle.bodytext} 
    11  p Current Image: 
    12  img(src='#{newsarticle.imgurl}') 
    13  p Update News Article Image: 
    14   input(type="file" name="profpic") 
    15  p 
    16   button#btnSubmit(type='submit'). 
    17    Update 

這是當我從段落刪除圖像拋出的錯誤日誌：

 9|  p Text for News Article: 
     10|   textarea(rows="5", cols="40", name='bodytext') #{newsarticle.bodytext} 
    > 11|  p Current Image: 
     12|  img(src='#{newsarticle.imgurl}')  
     13|  p Update News Article Image: 
     14|   input#inputProfPic(type="file" name="profpic") 

    unexpected text 
     p 

很抱歉打擾你並提前感謝您的時間。如果有什麼我可以提供的，會更有幫助，請讓我知道。

編輯：回答因此，感謝@jennifer，我意識到我希望完成的事情絕對是一種可能性。刪除並重寫代碼後，它工作。我看不出差別，但這裏是代碼的工作版本：

extends ../layout 

    block content 
     h1. 
      News Article ID #{newsarticle._id} 
     form(action='/newsarticles/#{newsarticle._id}/edit',method='post',name='updatenewsarticle',enctype='multipart/form-data') 
      p Title: 
       input(type='text', value='#{newsarticle.articletitle}', name='articletitle') 
      p Text for News Article: 
       textarea(rows="5", cols="40", name='bodytext') #{newsarticle.bodytext} 
      p Current Image: 
       img(src='#{newsarticle.imgurl}')     
      p Update News Article Image: 
       input#inputProfPic(type="file" name="profpic") 
      p 
       button#btnSubmit(type='submit'). 
        Update 

編輯＃2 **我已經查明的誤差。所以其他人幾乎不可能檢測到，但我已經複製了它。它存在的第11行，這是因爲我曾觸及當前圖像之後的空格鍵：這樣的代碼實際上看起來像這樣

11  p Current Image:" " 

但不包括引號。我只是將它們包括在內以顯示空間的位置。

編輯3 **這不是指出的解決方案，現在我可以在第11行後面插入一個空格，這很好。我仍在研究是什麼導致錯誤被拋出。我目前認爲這是一個空間問題的地方。會讓你更新。

Answer 1

我不確定細分在哪裏與您的特定代碼，但沒有理由不能在表單中包含圖像。您可以在表單中包含任何HTML元素。