Javascript 带两个html页面的角度ui路由器

我的项目有文件主页，第1页，第2页。 我的主页的页眉布局与其他页面不同。因此，它是一个单独的html文件。page1和Page2使用ui路由加载页面内容，但页眉和页脚相同

我的问题是：如果我在主页上并单击btn 1。如何将其加载到第1页的内容中？（它将加载index.html，但不会加载btn1的内容。）

我不确定将id传递给index.js是否是一种解决方案，我甚至不确定如何做到这一点。把整个东西都做成温泉会更有意义吗

带有按钮的My home.html：

<a type="text/html" href="home.html"  class="button home_btn">Home</a>
<a type="text/html" href="index.html" class="button my_btn1">Page1</a>
<a type="text/html" href="index.html" class="button my_btn2">Page2</a>

我现在问的问题让我有点困惑。我想我是在问如何构建一个具有多个页面的路由器。我让它工作。如果这没有帮助，我会看看是否可以找到资源或更好地解释它

导入用户界面路由器

<script src="vendors/angular-ui-router/release/angular-ui-router.js" type="text/javascript"></script>

---

我有一个完全相同的问题，你有没有想过？

<div id="headerLinks">
            <a type="text/html" href="home.html" class="button home_btn">Home</a>
            <a type="text/html" ui-sref="page1" class="button my_btn1">Page1</a>
            <a type="text/html" ui-sref="page2" class="button my_btn2">Page2</a>
        </div>
    </div>

    var app = angular.module('app', ['ui.router']);
    app.config(['$urlRouterProvider', '$stateProvider', function($urlRouterProvider, $stateProvider) {
        $urlRouterProvider.otherwise('/');
        $stateProvider
          .state('Page1', {
            url: 'Page1',
            templateUrl: 'Page1.html',
            controller: 'Page1Ctrl'
          })
          .state('Page2', {
            url: 'Page2',
            templateUrl: 'Page2.html',
            controller: 'Page2Ctrl'
          })

  }])

<script src="vendors/angular-ui-router/release/angular-ui-router.js" type="text/javascript"></script>

var app = angular.module('app', [
  'ui.router',
  'ctrls'
]);

app.config(['$urlRouterProvider', '$stateProvider', function($urlRouterProvider, $stateProvider, $state) {
  $urlRouterProvider.otherwise('/'); 
  $stateProvider
  .state('home',{
    url: '/home',
    views: {
      'header': {
        templateUrl: 'html/headerHome.html',
        controller: 'headCtrl'
      },
      'content': {
        templateUrl: 'home.html',
        //controller: 'ContentController' 
      }
    }
  })
  .state('page1', {
    url: '/page1',
    views: {
      'header': {
        templateUrl: 'html/header.html',
        controller: 'headCtrl'
      },
     'content': {
        templateUrl: 'page1.html',
        controller: 'page1Ctrl'
      }
    }
  })
  .state('page2', {
    url: '/page1',
    views:{
      'header':{
        templateUrl: 'html/header.html',
        controller: 'headCtrl'
      },
      'content':{
        templateUrl: 'page2.html',
        controller: 'page2Ctrl'
      }
    }
  })