Templates 如何将html/js代码与laravel4模板解耦？_Templates_Laravel 4

Templates 如何将html/js代码与laravel4模板解耦？

templates laravel-4

Templates 如何将html/js代码与laravel4模板解耦？,templates,laravel-4,Templates,Laravel 4,我想从我的laravel模板*.blade.php文件中分离html代码。我的dashboard.blade.php模板中有以下代码： <h1>Dashboard</h1> <p>Welcome to your Dashboard. You rock!</p> <div class="bubbletree-wrapper"> <div class="bubbletree"></div> </div&

我想从我的laravel模板*.blade.php文件中分离html代码。我的dashboard.blade.php模板中有以下代码：

<h1>Dashboard</h1>
<p>Welcome to your Dashboard. You rock!</p>
<div class="bubbletree-wrapper">
    <div class="bubbletree"></div>
</div>

我想把这段html代码从这里分离出来，并想把它移到另一个文件中，扩展名为*.html或*.tpl或*.php以外的任何其他文件

有可能吗？请帮我做这个

谢谢。

我没有看到任何人100%解耦HTML/CSS，但您可以遵循一些设计模式，如Presenter，并使用Laravel Blade，这样它就很少耦合

将视图命名为home.blade.php并将代码添加到其中，然后将代码更改为：

<h1>{{$pageTitle}}</h1>
<p>{{$welcomeMessage}}</p>
<div class="bubbletree-wrapper">
    <div class="bubbletree"></div>
</div>

您只有一行刀片，只需添加页面内容，现在您可以创建主视图，如下所示：

@extends('layout')

@section('contentSection')
    <h1>{{$pageTitle}}</h1>
    <p>{{$welcomeMessage}}</p>
    <div class="bubbletree-wrapper">
        <div class="bubbletree"></div>
    </div>
@stop

blade将为您呈现此HTML：

<!DOCTYPE html>
<html lang="en-us">
    <head>
        <meta charset="utf-8">
        <title> Your Application </title>
        <link rel="stylesheet" type="text/css" media="screen" href="css/bootstrap.min.css">
    </head>

    <body class="">

        <h1>Dashboard</h1>
        <p>Welcome to your Dashboard. You rock!</p>
        <div class="bubbletree-wrapper">
            <div class="bubbletree"></div>
        </div>

    </body>

</html>

为什么？php就是为了这个。它是一个模板文件。它应该包含HTML代码。你的问题就像我想开车去上班，但我不想开车去

@extends('layout')

@section('contentSection')
    <h1>{{$pageTitle}}</h1>
    <p>{{$welcomeMessage}}</p>
    <div class="bubbletree-wrapper">
        <div class="bubbletree"></div>
    </div>
@stop

<!DOCTYPE html>
<html lang="en-us">
    <head>
        <meta charset="utf-8">
        <title> Your Application </title>
        <link rel="stylesheet" type="text/css" media="screen" href="css/bootstrap.min.css">
    </head>

    <body class="">

        <h1>Dashboard</h1>
        <p>Welcome to your Dashboard. You rock!</p>
        <div class="bubbletree-wrapper">
            <div class="bubbletree"></div>
        </div>

    </body>

</html>