Question

我的标题在页面内容加载几乎一秒之后加载。之后将内容压缩。我想首先加载标题。

这是html

<body ng-app="tiide" ng-cloak>

    <div ng-controller="headerController">
        <div ng-include src=header.url></div>
        <script type="text/ng-template" id="header.html"></script>
    </div>

    <div>
       Hello.This is the main content of the page.
    </div>
</body>

这是我的主要javascript文件

var app = angular.module('tiide',['ngMaterial','ngAnimate','ngMessages','ngAria']);

app.controller('headerController', ['$scope', function($scope){
    $scope.header = {name: "header.html", url: "partials/header.html"};
}]);

以下是使用Angular材质制作的标题

<md-toolbar class="toolbar">
      <div class="md-toolbar-tools">
        <md-button aria-label="Go Back">
          Go Back
        </md-button>
        <h2>
          <span>This is the toolbar.</span>
        </h2>
        <span flex></span>
        <md-button class="md-raised" aria-label="Learn More">
          Learn More
        </md-button>
      </div>
    </md-toolbar>

Answer 1

快速解决此问题的方法是使用$ timeout（），不指定时间（默认为0），这将在线程末尾应用更改：

app.controller('headerController', ['$scope', '$timeout', function($scope, $timeout){
    $timeout(function(){
        $scope.header = {name: "header.html", url: "partials/header.html"};
    });
}]);

使用ng-include时在导航栏之前加载页面内容

1 个答案: