如何为我的两个指令添加不同的头部两个标签或不同的头部信息



I have main.cshtml file 它有一个包含css和js引用的head标签。

我有两个指令/模板。 我想有不同的两个标题。当页面 1 打开(有模板 1(时,我希望页面的标题是页面 1。 当页面 2 打开(有模板 2(时,我希望页面的标题是第 2 页。

我试图将头标签放在指令中,但它不读取标题和标题图标。

<div style="height: 100%">
<head>
<title>{{::title}}</title>}}
<link rel="shortcut icon" href="../../../../icons/icon1.ico">
</head>    
<div class="..." >
<div class="...">
<div>...............

它既不能那样工作,要么 head 标签在主div 上。

我尝试使用路由,在路由中给出标题属性,但在配置文件中无法读取 rootScope。

所以我尝试用模块运行((。但它也没有用。

module.run(function($rootScope){
$rootScope.$on("$routeChangeSuccess", function(currentRoute, 
previousRoute){
//Change page title, based on Route information
$rootScope.title = $route.current.title;  })  ;});

你能帮忙吗,我怎么能有这两个不同的标题和图标。或者,如果必须是两个不同的头标签才能看到它们,我该如何创建它们?

对于您的特定用例,我没有很多信息可以继续, 但是我们像这样以编程方式设置标题:

$document.prop('title', title);

您可以在$stateChangeSuccess上触发此代码。

在此示例中,您将在状态定义中定义标题,并在状态更改时对其进行更新:

var module = angular.module('someModule', ['ui.router']);
module.run(function($rootScope, $stateProvider, $document) {
// use ui-router additional route data to configure the title of the state
$stateProvider.state('someState', {
url: 'someUrl',
controller: 'SomeCtrl',
templateUrl: 'some.tpl.html',
data: {
title: 'Your states title goes here'
}
});
$rootScope.$on("$stateChangeSuccess", function(event, currentState) {
//Change page title, based on title found in route definition
$document.prop('title', currentState.data.title);
});
});

此示例假设您使用 ui 路由器进行路由。

相关内容

  • 没有找到相关文章

最新更新