Jetstream项目Blade模板@endforeach语法错误排查求助

首次使用Jetstream创建Laravel项目，添加数据存储功能后，program/index.blade.php页面出现语法错误：syntax error, unexpected token "endforeach", expecting "elseif" or "else" or "endif"。已确认foreach循环已闭合，不确定问题出在存储功能还是Blade指令使用上，相关代码如下：

program/index.blade.php #

<x-app-layout>
    <x-slot name="header">
        <h2 class="font-semibold text-xl text-gray-800 leading-tight">
            {{ __('Program') }}
        </h2>
    </x-slot>

    <div class="py-12">
        <div class="max-w-7xl mx-auto sm:px-6 lg:px-8">
          <a href="{{ route('program.create' )}}" class="bg-green-500 hover:bg-green--700 text-white font-bold py-2 px-4 rounded">Tambah Program</a>
          <br/>

          @foreach ($program as $programs)
            <a href="{{ route('program.show', $program->id) }}" class="group block max-w-xs mx-auto rounded-lg p-6 bg-white ring-1 ring-slate-900/5 shadow-lg space-y-3 hover:bg-sky-500 hover:ring-sky-500">
              <div class="flex items-center space-x-3">
                <svg class="h-6 w-6 stroke-sky-500 group-hover:stroke-white" fill="none" viewBox="0 0 24 24"><!-- ... --></svg>
                <h3 class="text-slate-900 group-hover:text-white text-sm font-semibold">{{ $program->year }}</h3>
              </div>
            </a>
          <br/>
          @empty
            <tr class="bg-white border-b dark:bg-gray-800 dark:border-gray-700">
              <td colspan="2" class="px-6 py-4 font-medium text-gray-900 dark:text-white whitespace-nowrap">
                {{ __('No programs') }}
              </td>
            </tr>
          @endforeach          
        </div>
    </div>
</x-app-layout>

ProgramController.php #

<?php

namespace App\Http\Controllers;

use Illuminate\Http\Request;
use App\Http\Requests\StoreProgramRequest;
use App\Http\Requests\UpdateProgramRequest;
use Illuminate\Support\Facades\Gate;
use Illuminate\Http\Response;
use App\Models\Program;

class ProgramController extends Controller
{
    /**
     * Display a listing of the resource.
     *
     * @return \Illuminate\Http\Response
     */
    public function index()
    {
        $program = Program::all();

        return view('program.index', compact('program'));
    }

    /**
     * Show the form for creating a new resource.
     *
     * @return \Illuminate\Http\Response
     */
    public function create()
    {
        return view('program.create');
    }

    /**
     * Store a newly created resource in storage.
     *
     * @param  \Illuminate\Http\Request  $request
     * @return \Illuminate\Http\Response
     */
    public function store(StoreProgramRequest $request)
    {
        Program::create($request->validated());

        return redirect()->route('program.index');
    }

    /**
     * Display the specified resource.
     *
     * @param  int  $id
     * @return \Illuminate\Http\Response
     */
    public function show(Program $program)
    {
        return view('program.show', compact('program'));
    }

    /**
     * Show the form for editing the specified resource.
     *
     * @param  int  $id
     * @return \Illuminate\Http\Response
     */
    public function edit(Program $program)
    {
        return view('program.edit', compact('program'));
    }

    /**
     * Update the specified resource in storage.
     *
     * @param  \Illuminate\Http\Request  $request
     * @param  int  $id
     * @return \Illuminate\Http\Response
     */
    public function update(UpdateProgramRequest $request, Program $program)
    {
        $program->update($request->validated());

        return redirect()->route('program.index');
    }

    /**
     * Remove the specified resource from storage.
     *
     * @param  int  $id
     * @return \Illuminate\Http\Response
     */
    public function destroy(Program $program)
    {
        $program->delete();

        return redirect()->route('program.index');
    }
}

StoreProgramRequest.php #

<?php

namespace App\Http\Requests;

use Illuminate\Foundation\Http\FormRequest;
use Illuminate\Support\Facades\Gate;

class StoreProgramRequest extends FormRequest
{
    /**
     * Determine if the user is authorized to make this request.
     *
     * @return bool
     */
    public function authorize()
    {
        return true;
    }

    /**
     * Get the validation rules that apply to the request.
     *
     * @return array<string, mixed>
     */
    public function rules()
    {
        return [
            'tahun' => 'required'
        ];
    }
}

语法错误的核心原因是**@empty指令的位置不符合Blade语法规范**：

Blade中@empty是@foreach的配套指令，必须直接紧跟在@foreach的起始标签之后，不能在循环内容和@empty之间插入任何代码（比如你写的<br/>）。解析器无法识别被隔开的@empty属于当前@foreach，因此把@endforeach判定为未匹配的指令，触发报错。

同时修正两个潜在问题：

1. 循环变量命名冲突：$program是集合变量，$programs作为单个模型变量易混淆，改为$singleProgram并修正循环内的变量调用；
2. 空状态标签不匹配：当前页面无表格，将<tr>改为<div>适配页面结构。

修改后的program/index.blade.php代码：

<x-app-layout>
    <x-slot name="header">
        <h2 class="font-semibold text-xl text-gray-800 leading-tight">
            {{ __('Program') }}
        </h2>
    </x-slot>

    <div class="py-12">
        <div class="max-w-7xl mx-auto sm:px-6 lg:px-8">
          <a href="{{ route('program.create' )}}" class="bg-green-500 hover:bg-green--700 text-white font-bold py-2 px-4 rounded">Tambah Program</a>
          <br/>

          @foreach ($program as $singleProgram)
            <a href="{{ route('program.show', $singleProgram->id) }}" class="group block max-w-xs mx-auto rounded-lg p-6 bg-white ring-1 ring-slate-900/5 shadow-lg space-y-3 hover:bg-sky-500 hover:ring-sky-500">
              <div class="flex items-center space-x-3">
                <svg class="h-6 w-6 stroke-sky-500 group-hover:stroke-white" fill="none" viewBox="0 0 24 24"><!-- ... --></svg>
                <h3 class="text-slate-900 group-hover:text-white text-sm font-semibold">{{ $singleProgram->year }}</h3>
              </div>
            </a>
            <br/>
          @empty
            <div class="bg-white border-b dark:bg-gray-800 dark:border-gray-700 p-6 rounded-lg">
              <p class="font-medium text-gray-900 dark:text-white">{{ __('No programs') }}</p>
            </div>
          @endforeach          
        </div>
    </div>
</x-app-layout>

内容的提问来源于stack exchange，提问作者Gizmo Hey