AngularJS动态页面标题首先加载大括号

时间:2014-08-31 10:23:53

标签: javascript angularjs angularjs-scope

<title ng-show="pageName">{{ $root.pageName }} - Domain Name</title>

我试图动态更改页面标题,当页面加载标题时预加载{{ $root.pageName }} - Domain Name而不是- Domain Name,然后在呈现时加载$rootScope.pageName

有没有办法隐藏{{ $root.pageName }}在页面加载时显示,直到应用程序获取变量?

4 个答案:

答案 0 :(得分:13)

你可以这样做:

<title ng-bind="$root.title + ' - Your site'">Your site</title>

请注意,在这种情况下,标题位于$rootScope

编辑:刚刚测试过,看起来破折号一直在显示,但这应该会阻止它:

<title ng-bind="$root.title ? $root.title + ' - Your site' : 'Your site' }]}">Your site</title>

答案 1 :(得分:1)

您可以使用ng-cloak指令隐藏原始(未编译)表单数据。我认为它会对您有所帮助。

<title ng-cloak>{{ $root.pageName }} - Domain Name</title>

ngCloak指令用于防止浏览器在加载应用程序时以原始(未编译)形式短暂显示Angular html模板。

请参阅this链接了解详情。

答案 2 :(得分:0)

在标题中使用ng-show没有意义。你可以这样做:

<title ng-bind="'MyApp - ' + $root.title">MyApp - Welcome</title>

$routeProvider.when('/product', {templateUrl: '/partials/product.html',  controller: 'ProductCtrl', title: 'Discover our Product'}).when('/about', {templateUrl: '/partials/about.html', controller: 'AboutCtrl', title: 'About US'});
在你的run()上添加$ rootScope。$ on:

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

阅读完整资料来源:https://coderwall.com/p/vcfo4q

答案 3 :(得分:-3)

是的,这是可能的。

做这样的事情

<title ng-show="pageName">
    <span ng-model="pageName"></span>
    <span> - Domain Name</span>
</title>