Question

我有一些只能工作一次的AngularJS指令。当视图更改并且您返回它们不再有效时，不会涉及页面刷新，但我们使用简单的视图加载系统使用ng-include进行页面更改（子页面不是主要路径）。

我有一些类似的标记。

<div class="row" ng-controller="mainCtrl">
    <ul class="sidebar span3" sub-nav>
        <li><a ng-click="changePage('users')">Users</a></li>
        <li><a ng-click="changePage('posts')">Posts</a></li>
    </ul>
    <div class="span9" view-partial ng-include="route[active]"></div>
</div>

“sub-nav”指令有一个更新“active”范围变量的方法。然后，我有一个指令，它监听“active”变量的更改，如果值不同则发出“pageChange”事件。（它们与控制器分开，因为它们不仅仅应用于控制器）。一次只有一个控制器运行此代码，它似乎完美无缺。

在ng-include中我们使用ng-repeat循环遍历数据，在这个循环中生成的表我们有一个删除按钮，其中有一个指令就像这个一样

angular.module("myModule")

    .directive("deleteBtn", function(delConf) {
        require: "?ngModel",
        link: function(scope, elm, attr, ngModel) {
            elm.bind("click", function(e) {
                // here i open a modal window and pass some data to it
                // just as a delete confirmation the logic for it is tucked 
                // away in delConf
            }
        }
    })

    .directive("deleteConfBtn", function(delConf) {
        require: "?ngModel",
        link: function(scope, elm, attr, ngModel) {
            elm.bind("click", function(e) {
                // here i make the api request to delete the item and remove it
                // from the scope
            }
        }            
    });

第一个指令应用于表中的删除按钮（即使视图发生更改，此指令也始终有效）。第二个指令应用于bootstrap模态窗口上的按钮。

第二个指令仅在页面刷新后才起作用。我认为它与范围有关，但我无法弄清楚为什么一个工作而另一个工作失败。

非常感谢任何帮助。

AngularJS指令仅在ng-include更改之前有效

0 个答案: