Question

我正在开发一个需要在每个页面上拥有相同指令的应用。不幸的是，它没有按预期工作。

我们说我打开应用并访问 ID = 1

的页面

加载ID = 1的页面，我点击指令，一切都按预期工作。

现在，我更改了页面，然后转到 ID = 2

的页面

像以前一样，页面加载，我点击＆＃39;指令＆＃39;但没有任何反应。

如果现在我返回 ID = 1 的页面，该指令将在该页面中打开。

基本上，我认为更改页面足以使指令在新页面上重新呈现，但显然不是。

的index.html：

<my-directive></my-directive>

directive.coffee：

angular.module('myApp', [ 'ionic' ]).directive 'myDirective', ->
  {
  restrict: 'E'
  scope:
    mode: '@mode'
  replace: true
  templateUrl: 'templates/template.html'
  }

我在这里创建了一支笔：http://codepen.io/anon/pen/Xdqrve?editors=1010

任何帮助？

Answer 1

您使用类似的复选框name和标记for值时遇到问题。

您必须像这样更改mode参数：

<mode-selector mode="1"></mode-selector> <mode-selector mode="2"></mode-selector> <mode-selector mode="3"></mode-selector>

并将mode附加到复选框名称＆amp;标签ID：

<input type="checkbox" href="#" class="menu-open" name="menu-open-{{mode}}" id="menu-open-{{mode}}"/>
<label class="menu-open-button" for="menu-open-{{mode}}">
    <i class="zone-details-current-mode icon-mode-{{mode}}"></i>
    <span class="hamburger hamburger-1"></span>
    <span class="hamburger hamburger-2"></span>
    <span class="hamburger hamburger-3"></span>
</label>

angularjs - 无法从不同的页面调用相同的指令

1 个答案: