有没有办法可以在 Laravel 刀片中单独包含部分？答案

【问题标题】：Is there a way I can separately include section in Laravel blade?有没有办法可以在 Laravel 刀片中单独包含部分？
【发布时间】：2015-08-17 08:42:49
【问题描述】：

当在 laravel Blade 中扩展视图时，有多个插入位置，可以这样做：

<html>
<head>
    <title>This is app/view/layout/default.blade.php</title>
    {{ HTML::script('js/jquery-2.1.3.min.js') }}
    {{ HTML::script('js/angular.js') }}
    @yield('extra_libraries')
</head>
<body>
    <div class="left-menu-bar">
        @yield('left-menu-bar')
    </div>
    <div class="main-content">
        @yield('main-content')
    </div>
</body>
</html>

那么，在使用布局的时候，

@extend ("layout.default")
@section('extra_libraries')
    {{ HTML::script('js/underscore.js') }}
@stop
@section('left-menu-bar')
    <a href="http://www.google.com/">testing button</a>
@stop
@section('main-content')
    testing
@stop

当我不扩展但将另一个刀片包含到我当前的刀片中时，我想要的是类似的功能。即这样的事情：

<html>
<head>
    <title>This is app/view/layout/default.blade.php</title>
    {{ HTML::script('js/jquery-2.1.3.min.js') }}
    {{ HTML::script('js/angular.js') }}
</head>
<body ng-app="myTestingApp">
    <div ng-controller="testing">
        @include('components.componentA.htmlComponent'）
        @include('components.componentB.htmlComponent'）
    </div>
    <script>
    var app = angular.module('myTestingApp', []).controller("testing", testingController);
    function testingController($scope) {
        @include('components.componentA.angularCode')
        @include('components.componentB.angularCode')
    }
    </script>
</body>
</html>

componentA 应该是一个包含 anguarCode 和 htmlComponent 的刀片文件。我知道我可以将它们分成 2 个文件，但我想看看是否有办法将它们放在同一个文件中，因为它们密切相关。 laravel 刀片中是否有默认功能来实现这一点？

附：这个例子说明了为什么我想把它们放在一起，如果你知道 angularjs。

【问题讨论】：

标签： php laravel-4 blade php-include

【解决方案1】：

将另一个刀片包含到我当前的刀片中

好吧，要在现有的刀片文件中包含另一个刀片文件，绝对是 @include 标记来拯救这一天。如果仍然不能满足您的要求，您可以随时通过extending Blade编写自己的方法。

然而，整个事情对我来说似乎有点太复杂了。为什么不将你的 JavaScript 分成不同的控制器，然后使用ng-view 调用相应的 HTML，如文档底部的示例所示。

【讨论】：

感谢您推荐 ng-view。我是 Angularjs 的新手，没有注意到还有另一种选择。但是，由于它正在从 URL 加载另一个页面，所以我需要另一个控制器来返回正确的视图？此外，它似乎正在加载运行中的页面，我想在其中预加载所有页面。所以好像不太适合我。我会尝试扩展 Blade。
好吧，在这种情况下，您还可以查看ng-switch，它可以帮助您呈现静态内容。这是plnkr中一个非常简单的例子plnkr.co/edit/r58waZQdtNLAkUE01GFS?p=preview

【解决方案2】：

不确定，但你可以试试

...
<body ng-app="myTestingApp">
    <div ng-controller="testing">
        @yield('componentA-html'）
        @yield('componentB-html'）
    </div>
    <script>
    var app = angular.module('myTestingApp', []).controller("testing", testingController);
    function testingController($scope) {
        @yield('componentA-angularCode'）
        @yield('componentB-angularCode'）
    }
    </script>
</body>
@include('components.componentA')
@include('components.componentB')
</html>

你的componentA刀片应该是

@section('componentA-html')
   html for A
@endsection
@section('componentA-angularCode')
   angularCode for A
@endsection

comomentB 刀片的方法相同

【讨论】：