Angular ng-包括不使用laravel niews:刀片模板

时间:2018-01-09 14:11:27

标签: angularjs laravel

我不太熟悉angularjs +刀片模板混合。 laravel的刀片模板不呈现ng-include(angularjs)html文件。或者是否有必要将所有包含的html转换为刀片文件?使用核心PHP不是问题。在这种情况下工作的方式是什么?

  <title>{{ config('app.name', 'Nepstralia')}}</title>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
  <link rel="stylesheet" href="custom.css">
  <link rel="stylesheet" href="assets/css/Footer-with-map.css">
  <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css">
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
  <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
  <script src = "http://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular.min.js"></script>




<ng-include src="'nav.html'"> </ng-include>
<!-- <div id="toptarget"> &nbsp; </div><br> -->


<ng-include src="'carousel.html'"> </ng-include>

非ng-included正在加载刀片模板。如何使用角度ng-include刀片?

1 个答案:

答案 0 :(得分:0)

首先你必须通过ng-app声明角度应用,然后尝试以下方法: 的index.html:

  <!DOCTYPE html>
<html>
<head>
    <title></title>
    <meta charset="utf-8" />
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
    <link rel="stylesheet" href="custom.css">
    <link rel="stylesheet" href="assets/css/Footer-with-map.css">
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css">
</head>
<body ng-app>





<div ng-include="'nav.html'"> </div>
<!-- <div id="toptarget"> &nbsp; </div><br> -->


<div ng-include="'carousel.html'"> </div>

    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
    <script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular.min.js"></script>

</body>
</html>

carousel.html:

<h1>123</h1>

nav.html

<h2>145</h2>

如果它不起作用可能是你的src错了。