ngHref

如果我們在 href 值內有一個角度表示式，則使用 ngHref 代替 href 屬性。ngHref 指令使用 href 屬性（如標記，標記等）覆蓋 html 標記的原始 href 屬性。

即使使用者在 AngularJS 評估程式碼之前單擊連結，ngHref 指令也確保連結不會中斷。

例 1

<div ng-init="linkValue = 'http://stackoverflow.com'">
    <p>Go to <a ng-href="{{linkValue}}">{{linkValue}}</a>!</p>
</div>

示例 2 此示例動態從輸入框獲取 href 值並將其載入為 href 值。

<input ng-model="value" />
<a id="link" ng-href="{{value}}">link</a>

例 3

<script>
angular.module('angularDoc', [])
.controller('myController', function($scope) {
  // Set some scope value.
  // Here we set bootstrap version.
  $scope.bootstrap_version = '3.3.7';
   
  // Set the default layout value
  $scope.layout = 'normal';
});
</script>
<!-- Insert it into Angular Code -->
<link rel="stylesheet" ng-href="//maxcdn.bootstrapcdn.com/bootstrap/{{ bootstrap_version }}/css/bootstrap.min.css">
<link rel="stylesheet" ng-href="layout-{{ layout }}.css">