模板更改时未调用Angular ng-view onload

时间:2016-09-07 19:47:51

标签: angularjs routing onload

我有一个简单的SPA,它使用Node / Express静态传送,然后完全运行客户端。在index.html中,我有一个附加到<body>的ng-view用于我的路径特定模板:

<html ng-app="PortfolioSPAModule" ng-controller="AppCtrl">
  <head>
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <base href="/">
    <title></title>
    <link rel="stylesheet" href="/bootstrap/css/bootstrap.min.css">
    <link rel="stylesheet" href="/stylesheets/dist.min.css">

    <script defer="defer" data-pin-hover="true" data-pin-save="true" src="//assets.pinterest.com/js/pinit.js" data-pin-build="parsePins"></script>
  </head>
  <body ng-view onload="console.log('hi!')">

  </body>

  <script src="/angular/angular.min.js"></script>
  <script src="/lib/angular-route.min.js"></script>
  <script src="/lib/dist.min.js"></script>
  <script src="/javascripts/jquery-1.11.1.min.js"></script>
  <script src="/bootstrap/js/bootstrap.min.js"></script>
</html>

这里没什么好惊讶的。我的应用程序包含在dist.min.js.主应用程序在此处定义:

(function(){
  angular.module('PortfolioSPAModule', ['ngRoute']);

  function config ($routeProvider, $locationProvider){
    $routeProvider
      .when('/', {
        templateUrl: 'home/home.view.html',
        controller: 'homeController',
        controllerAs: 'viewModel'
      })
      .when('/about', {
        templateUrl: 'about/about.view.html',
        controller: 'aboutController',
        controllerAs: 'viewModel'
      })
      .otherwise({redirectTo: '/'});

    $locationProvider.html5Mode(true);
  }

  // Add the config to our app.
  angular
    .module('PortfolioSPAModule')
    .config(['$routeProvider', '$locationProvider', config]);
  })();

注意在index.html中我已经为body onload定义了一个简单的控制台输出。我的理解是,根据这个工作示例,每次更改模板时都应该触发onload:http://jsfiddle.net/E259J/12/?utm_source=website&utm_medium=embed&utm_campaign=E259J

和本文:http://liamkaufman.com/blog/2013/11/11/understanding-angularjs-directives-part2-ng-view/

在我的应用程序中,正文的onload方法仅在页面中被触发一次&#39;初始负荷。

有没有人知道为什么会发生这种情况?这是预期的行为吗?

我也很欣赏有关ng-view的一些其他信息。当我在Chrome开发工具中查看我的html时,我没有看到指定的任何包含的脚本。什么是ng-view对我添加的任何脚本做什么?它运行一次,然后隐藏它们吗?他们可以再次重新运行吗?附加的脚本是否应该知道ng-view中包含的模板的任何更改?

有关ng-view如何在这方面起作用的任何信息都会有所帮助!

0 个答案:

没有答案