Angularjs 如何在加载到选项卡内的angular应用程序中创建链接？

我在angular应用程序中有一个链接，如下所示：

<tab ng-controller="childCtrl" heading="Children">
 <a href="#/parent/{{parent.Id}}/child/{{child.Id}}">edit</a>
</tab>

---

如何在选项卡内加载链接而不是刷新整个视图？

单击链接时，您可以定义所选选项卡内容的路径，并使用它来显示

<div ng-repeat="parent in parents">
  <div ng-repeat="child in parent.children">
    <a href="" ng-click="selectPath(parent, child);">
      Parent {{parent.Id}}, Child {{child.Id}}
    </a>
  </div>
</div>
<div ng-include="selected.path"></div>

---

这里是一个演示：

我喜欢其他方法，一点处理所有路由。带有嵌套视图的ui.router允许这样做

模板

<div ><a ui-sref="home.tab1" >Tab1</a></div>
<div><a ui-sref="home.tab2" >Tab2</a></div>
<br>
<div ui-view="tabs"></div> 

---

演示

这真的很有趣！但愿我能否决这条评论，我已经删除了这条评论，因为它困扰着你。

var app = angular.module('plunker', ['ui.router']);
  app.config(function ($stateProvider, $urlRouterProvider) {
    $stateProvider
      .state('home', {
        url: '/home',
        templateUrl: 'main.html',
        controller: 'MainCtrl',
        virtual: true
      })
      .state('home.tab1', {
        url: '/tab1',
        views: {
          tabs: {
            templateUrl: '1.html'
          }
        }

      })
      .state('home.tab2', {
        url: '/tab2',
        views: {
          tabs: {
            templateUrl: '2.html'
          }
        }
      });
      $urlRouterProvider
      .otherwise('/home/tab1');
  })