一尘不染

Angular.js:在单个HTML中有多个局部词?

angularjs

是否可以在单个html中检索多个html部分?我有下一种情况:

Template: {header} {main} {footer}

/index: header:"Welcome" main:"welcome text" footer:""

/help: header:"Help title" main:"faq tips" footer"Back to home"

使用 ng-include 我必须从服务器检索6 html。如果我将在一个html中检索多个部分,那么我将仅从服务器检索2个html,一个用于/
index,一个用于/ help。

  • 这种情况只是真实情况的一个小例子。
  • 类型为 ng-template* 的标记 脚本 对我不起作用,因为该脚本必须在 ng-include 之前 包含 ***

谢谢!

更新04/07/12:

我试图一次更新一个以上的div,并使用唯一的html retreive。我不喜欢这样:

function IndexCtrl($scope) {
    $scope.mainPage = 'partials/index/index.html';
    $scope.headerTemplate = 'partials/index/header.html';
    $scope.footerTemplate = 'partials/index/footer.html';
}

在模板中使用ng-includes包括这些部分之后。我认为这不是正确的方法。还有其他方法吗?

谢谢!


阅读 246

收藏
2020-07-04

共1个答案

一尘不染

模板可以嵌入到主html中。例如,使用以下代码index.html

<!DOCTYPE html>
<html ng-app=app>
<meta charset=utf-8>
<title>App</title>
<ng-view>Loading...</ng-view>
<script type=text/ng-template id=partial1.html>
 <p>foo = {{foo}}</p>
</script>
<script type=text/ng-template id=partial2.html>
 <p>Contents of partial2.html</p>
</script>
<script src=app.js></script>

您可以使用以下内容app.js

angular.module('app', [], ['$routeProvider', '$controllerProvider', function($routeProvider, $controllerProvider) {

  $routeProvider.when('/p1', { templateUrl: 'partial1.html', controller: 'Partial1' });

  $controllerProvider.register('Partial1', ['$scope', function($scope) {
    $scope.foo = 'bar';
  }]);
}]);

$
templateCache服务
文档具有更多详细信息。

2020-07-04