ANGULARJS - 里面H1标题显示在主页和网站的其他div标签 [英] ANGULARJS - display title inside h1 on homepage and div tag for the rest of the site
问题描述
有关无障碍符合：
如何显示页面内的＆LT称号; H1＆GT; 标记在主页上，而＆LT内部显示屏; DIV＆GT; 该网站的其他标记。
我使用的角度 UI-路由器，具有'家'的状态网页。
app.js：
magApp.config（函数（$ stateProvider，$ urlRouterProvider，$ locationProvider）{
$ urlRouterProvider.otherwise（/ 404）;//现在设置状态
$ stateProvider
.STATE（'page_404'，{ templateUrl：应用/模板/ 404.html'
}）
.STATE（'家'，{
网址：'/'，
templateUrl：应用/模板/ home.html做为'，
控制器：'issueController
}）
我曾尝试：
＆LT; H1数据-NG-IF =家级=UWM现场标题＆GT;
＆LT; A HREF =/＆GT;网站名称和LT; / A＆GT;＆LT; / H1＆GT;
＆LT;！家的div日期-NG-IF = CLASS =UWM现场标题＆GT;
＆LT; A HREF =/＆GT;网站名称和LT; / A＆GT;＆LT; / DIV＆GT;
我也试过
＆LT; H1数据-NG-秀=$ state.current.name ==='家'级=UWM现场标题＆GT;
＆LT; A HREF =/＆GT;网站名称和LT; / A＆GT;＆LT; / H1＆GT;
＆LT; DIV数据-NG-秀=！$ state.current.name =='家'级=UWM现场标题＆GT;
＆LT; A HREF =/＆GT;网站名称和LT; / A＆GT;＆LT; / DIV＆GT;
有
本机 UI-路由器解决方案将由
所以，这将是我们的根HTML code段（index.html的
＆LT;身体GT;
...
＆LT;格UI视图=标题＆GT;
＆LT; H1＆gt;这是默认的TITLE＆LT; / H1＆GT;
＆LT; / DIV＆GT; ... //后来更多的用户界面视图计有不愿透露姓名的用户界面视图=
因此，对于所有在这一刻显示内容状态这一观点的意愿：＆LT; H1＆gt;这是默认的TITLE＆LT; / H1＆GT; 。换句话说，这种状态会按原样显示这些内容，因为它不与命名视图工作的 用户界面视图=标题
.STATE（'家'，{
网址：/家，
templateUrl：tpl.html'，
}）
但有可能是一个国家的家庭，这将改变它的（它的母公司会，孩子们将利润）的
.STATE（'父'，{
网址：/父，
观点：{
''：{templateUrl：tpl.html'，}，
'称号@：{模板：＆LT; H2＆GT;标题为母公司及其子家庭＆LT; H2＆gt;中，}
}
}）
.STATE（'parent.child'，{
网址：/子，
...
}）
...
另外一个国家的家庭可以有不同的标题：
.STATE（'其他'，{
网址：/等，
观点：{
''：{templateUrl：tpl.html'，}，
'称号@：{模板：＆LT; H2＆gt;其他家庭，这根具有此标题＆LT; H2＆gt;中，}
}
}）
这可以重复多次。即使任何一个孩子可以只使用绝对命名为视图针对申报自己的标题为 称号@'
一些更多的信息，如何使用一个根状态的所有孩子的家庭的（后容易一些常见的东西，适用于所有国家）的的角UI路由器 - 嵌套国多种布局
更多关于绝对视图命名 - 角UI路由器：嵌套视图不工作
检查一下这里
For accessibility compliance:
How do I display the title of the page inside an <h1> tag on the homepage, while display inside a <div> tag for the rest of the site.
I am using angular UI-Router, with the homepage having a state of 'home'.
app.js:
magApp.config(function($stateProvider, $urlRouterProvider, $locationProvider) {
$urlRouterProvider.otherwise("/404");
// Now set up the states
$stateProvider
.state('page_404', {
templateUrl: 'apps/templates/404.html'
})
.state('home', {
url: '/',
templateUrl: 'apps/templates/home.html',
controller : 'issueController'
})
I have tried:
<h1 data-ng-if="home" class="uwm-site-title">
<a href="/">Site Name</a></h1>
<div date-ng-if="!home" class="uwm-site-title">
<a href="/">Site Name</a></div>
I have also tried
<h1 data-ng-show="$state.current.name === 'home'" class="uwm-site-title">
<a href="/">Site Name</a></h1>
<div data-ng-show="$state.current.name !== 'home'" class="uwm-site-title">
<a href="/">Site Name</a></div>
There is a working example
The native UI-Router solution would be driven by
So, this would be our root html code snippet (index.html
<body>
...
<div ui-view="title">
<h1>This is the default TITLE</h1>
</div>
... // later more ui-view inlcuding unnamed ui-view=""
So, this view will for all the states at this moment showing the content: "<h1>This is the default TITLE</h1>". Other words, this state will show this content as is, because it does not work with named view ui-view="title":
.state('home', {
url: "/home",
templateUrl: 'tpl.html',
})
But there could be one state family, which will change it (parent of it will, children will profit)
.state('parent', {
url: "/parent",
views: {
'' : {templateUrl: 'tpl.html', },
'title@' : {template: "<h2>title for parent and its children family<h2>",}
}
})
.state('parent.child', {
url: "/child",
...
})
...
Another state family could have different title:
.state('other', {
url: "/other",
views: {
'' : {templateUrl: 'tpl.html', },
'title@' : {template: "<h2>other family with this root has this title<h2>",}
}
})
This could be repeated as many times. And even any child could declare its own title just by using the absolute naming for view targeting: 'title@'
Some more info, how to use one root state for all children families (later easy to apply some common stuff to all states) Angular UI Router - Nested States with multiple layouts
More about absolute view naming - Angular-UI Router: Nested Views Not Working
Check it here
这篇关于ANGULARJS - 里面H1标题显示在主页和网站的其他div标签的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
