使用 ngView 加载其他页面时使用 ngInclude 加载 html 块答案

【问题标题】：load html blocks with ngInclude when load other page with ngView使用 ngView 加载其他页面时使用 ngInclude 加载 html 块
【发布时间】：2014-07-09 18:23:20
【问题描述】：

实际上我想制作一些 html 块并通过 ngInclude 加载它们，当我通过控制器调用页面时，ngView 显示包含我的 html 块的页面例如像这个脚手架

root
index.html -----> 包含用于加载页面的 ngView
app.js
--------root/views
Dashboard.html ----> 包含仪表板的 html 块
--------------root/views/Dashboard
dashboard-profile.html ---->仪表板的html块 ... ...

我尝试了下面的代码，但它不起作用

app.js

var demoApp = angular.module('sampleApp', ['ngRoute']);

demoApp.config(function ($routeProvider){
    $routeProvider
    .when('/dashboard',
          {
              controller: 'SimpleController1',
              templateUrl: 'views/dashboard.html'
          })
    .when('/page',{
        controller: 'SimpleController2',
        templateUrl: 'Sources/views/page2.html'
    })
    .otherwise({ redirectTo: '/dashboard' });
});

demoApp.controller('myCtrl', function($scope) {
    $scope.dashboardprofile = 'views/dashboard/dashboard-profile.html';
});

index.html

<body ng-app="sampleApp" >

<div ng-view ></div>

    <!-- compiled and minified Bootstrap JavaScript -->
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.19/angular.min.js"></script>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.19/angular-route.js"></script>
<script type="text/javascript" src="Sources/app2.js"></script>

</body>

dashboard.html

<div ng-include='dashboardprofile' ng-controller="myCtrl"></div>

dashboard-profile.html

  Some divs and text

感谢您的帮助

【问题讨论】：

jsfiddle.net/mrajcok/MfHa6
请提供小提琴或 plunkr
可能重复stackoverflow.com/questions/13943471/angularjs-ng-include
@samrodrigues 我两个都试过了，都不行。其实我想 ngInclude 在 html 块中而不是在索引文件中
@Raghav 这里是链接：plnkr.co/edit/B5uSQGVv0qpIU79FxDMC

标签： html angularjs angularjs-directive block

【解决方案1】：

试试这个..

 var demoApp = angular.module('sampleApp', ['ngRoute']);

 demoApp.config(function ($routeProvider){
  $routeProvider
.when('/dashboard',
      {
          controller: 'myCtrl',
          templateUrl: 'views/dashboard.html'
      })
.when('/page',{
    controller: 'SimpleController2',
    templateUrl: 'Sources/views/page2.html'
})
.otherwise({ redirectTo: '/dashboard' });
});

demoApp.controller('myCtrl', function($scope) {
$scope.dashboardprofile = 'views/dashboard/dashboard-profile.html';
});

【讨论】：