Question

我正在使用Ionic framework创建应用程序。

我需要能够重用和更改我的应用程序标题，所以我使用我的工作标记将两个不同的标题声明为指令。

app.directive('headerSidebar', function(){
  return {
    templateUrl: 'templates/header-main.html',
    restrict: 'E'
  };
});

app.directive('headerBack', function(){
  return {
    templateUrl: 'templates/header-back.html',
    restrict: 'E'
  };
});

当我尝试使用<header-sidebar></header-sidebar>或<header-back></header-back>调用指令时，没有任何反应。

我的HTML有效且我的模板网址是正确的。我试过更改我的指令和模板的名称，但没有任何效果。

我正在使用Ionic sidebar layout，我在ion-nav-view内调用我的指令：

 <body ng-app="starter">

    <ion-side-menus>

      <ion-side-menu-content>
        <ion-nav-view></ion-nav-view>
      </ion-side-menu-content>

      <sidebar></sidebar>

    </ion-side-menus>

  </body>

有关如何解决此问题的建议或重新组织我的代码以更好地包含标题栏？

Answer 1

我的问题最终与你的问题有所不同。经过进一步检查，我意识到我的所有templateUrls之前都有'/'，这实际上导致了问题

Answer 2

我有类似的问题。这是由于URL中的相对路径。这在浏览器中工作正常但在App中不行。我从网址路径中删除了../。

Angular指令不在离子应用程序中呈现

2 个答案: