AngularJS 錨點路由的定義

2018-07-26 17:28 更新

要使用錨點路由功能，需要在先定義它。目前，對于定義的方法，我個人只發(fā)現(xiàn)在“初始化”階段可以通過 $routeProvider 這個服務來定義。

在定義一個 app 時可以定義錨點路由：

<html ng-app="ngView">
  ... ...

<div ng-view></div>

<script type="text/javascript">

angular.module('ngView', [],
  function($routeProvider){
    $routeProvider.when('/test',
      {
        template: 'test',
      }
    );
  }
);

</script>

首先看 ng-view 這個 directive ，它是一個標記“錨點作用區(qū)”的指令。目前頁面上只能有一個“錨點作用區(qū)”。有人已經提了，“多個可命名”的錨點作用區(qū)的代碼到官方，但是目前官方還沒有接受合并，我覺得多個作用區(qū)這個功能是很重要的，希望下個發(fā)布版中能有。

錨點作用區(qū)的功能，就是讓錨點路由定義時的那些模板， controller 等，它們產生的 HTML 代碼放在作用區(qū)內。

比如上面的代碼，當你剛打開頁面時，頁面是空白的。你手動訪問 /#/test 就可以看到頁面上出現(xiàn)了 'test' 的字樣。

在 angular.bootstrap() 時也可以定義：

angular.bootstrap(document.documentElement, [
  function($routeProvider){
    $routeProvider.when('/test',
      {
        template: 'test'
      }
    );
  }
]);


以上內容是否對您有幫助：
在線筆記
App下載
App下載

掃描二維碼

下載編程獅App

公眾號
微信公眾號

編程獅公眾號