前端控制台报错Failed to load resource: the server responded with a status of 400 () deleteParticle/%7B

前端报错deleteParticle/%7Bid%7D:1

（我就是记录一下我的错误 以及怎么解决的 大神勿喷 谢谢）
近几天刚开始接触前端，一开始什么都不会 ，只会一点静态界面的制作，部门需要我进行前后端的联调，所以自己写了一个小例子，但是前后端一直都不能连接起来。最后问了懂前端的才解决问题（其实就是我一点都不懂，遇到的问题很简单）。
下面的是我的list.js界面

$(function (){
    init();
})
function clicks(){
    alert('click')
}
function init() {
    $.ajax({

        url: "http://localhost:8080/particle/findAll",
        type: "get",
        success: function f(data) {
            console.log(data);
            debugger;
            // window.location.href = BASE_PATH + "/view/user/index.html";
            let tbody = document.getElementById('tbody')
            const tempArr=[]
            data.forEach(item=>{
                let tr = `<tr><td>${item.id}</td><td>${item.particle}</td><td>${item.photon}</td><td>${item.blood}</td><td><button type="button" class="btn btn-primary" οnclick="window.location.href='/particle/updatelist.html'">编辑</button>
<!--                <button type="button" class="btn btn-danger" οnclick="del(id)" )">删除</button>-->
                </td></td>`
                tempArr.push((tr))
            })
            tbody.innerHTML = tempArr.join('')
        }
    });
}
//删除

$("table tbody").on("click","button",function (){
    delete (this);
})

/**
 * 删除
 * @param id
 */
function del(id){
    alert(id)
    var user={
        "id":id,
    };
    $.ajax({
        type: "get",
        url: 'http://localhost:8080/particle/deleteParticle/{id}',
        pagination:true,
        //data:{id:"1"},
        contentType:"application/json; charset=utf-8",
        dataType: 'json',
        success:function (data){
            alert("删除成功");
            },
        error:function (data){
            alert("删除失败");
        },
    });
};

下面就是我的控制层的界面

package com.curd.demo.controller;


import com.curd.demo.entity.Particle;
import com.curd.demo.service.ParticleService;
import org.springframework.ui.Model;
import org.springframework.web.bind.annotation.*;

import javax.annotation.Resource;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import java.util.Collection;
import java.util.List;

@RestController
@ResponseBody
@RequestMapping("/particle")
public class ParticleController {

    @Resource
    private ParticleService particleService;


    /**
     * 显示所有的内容
     //     */
//    @RequestMapping("/show")
//    public String list(Model model){
//        Collection<Particle> particles = particleService.findAll();
//        model.addAttribute("show",particles);
//        return "/particle/list";
//    }

    /**
     * 查询表所有的内容
     *
     * @return
     */
    @GetMapping("/findAll")
    public List<Particle> findAll() {
        return particleService.findAll();
    }

    /**
     * 下面就是增加一个人员信息
     */
    @PostMapping("/addParticle")
    public void addParticle(@RequestBody Particle particle) {
        particleService.addParticle(particle);
    }

    /**
     * 根据id修改一个人的信息
     */
    @PostMapping("/updateParticle")
    public void updateParticle(@RequestBody Particle particle) {
        particleService.updateParticle(particle);
    }

    /**
     * 根据id删除一个人的信息
     */
    @GetMapping("/deleteParticle/{id}")
    public Long deleteParticle(@PathVariable Long id) {
        particleService.deleteParticle(id);
        return id;
    }

    /**
     * 根据id查找人员的信息
     */
    @GetMapping("/getOne")
    public List<Particle> getOne(Long id) {
        return particleService.getOne(id);
    }

    /**
     * 是否可以根据名字来模糊查询一个人的信息
     * 现在开始尝试一下
     */
    @GetMapping("/FuzzyQuery")
    public List<Particle> FuzzyQuery(String particle) {
        return particleService.FuzzyQuery(particle);
    }

    /**
     * 失败的方法
     *
     * @param particle
     */
    @GetMapping("/deleteForParticle")
    public void deleteForParticle(String particle) {
        particleService.deleteForParticle(particle);
    }

}

我的那个deleteParticle就一直报错，报错的信息是

最后才知道是因为id没有传进去，前后端的数据链接不起来，所以就改成了下面这样。

/**
 * 删除
 * @param id
 */
function del(id){
    alert(id)
    var user={
        "id":id,
    };
    $.ajax({
        type: "get",
        url: 'http://localhost:8080/particle/deleteParticle/4',
        pagination:true,
        //data:{id:"1"},
        contentType:"application/json; charset=utf-8",
        dataType: 'json',
        success:function (data){
            alert("删除成功");
            },
        error:function (data){
            alert("删除失败");
        },
    });
};

将url最后的改成了具体的数据，然后就执行成功了。

我写这个就是当一个错题本使用，希望大神 ，大佬们 不要骂我呀！！！！！