Question

我创建了一个指令，它只是将存储在.html中的一些div标签转换为单个元素。我注意到该指令只在页面重新加载时编译，当路由被更改时，指令没有被启动，我知道你可以使用$ routeChangeSucess或$ scope.watch来检测路由更改，但在我的情况下我没有使用这个目录中的链接函数，我只使用templateUrl。在路由更改时重新加载/重新运行此指令的最佳方法是什么。这是我的代码;

stockfront.factory('directiveConfig', function(){
factory = {};
factory.returnConfig = {
    scope : true,
    restrict: "E",
    replace: true,
    templateUrl : "",
    template : "",
    transclude  : true,
    link  : "",
    combine: ""
};

return factory;
});

stockfront.directive("mainDiv", function(directiveConfig){

directiveConfig.returnConfig.templateUrl = "./template/mainDiv.html";

return directiveConfig.returnConfig;

});

这就是我试过的@Valery Kozlov：

stockfront.run(function($rootScope) {
    $rootScope.routeChange = false;
    $rootScope.$on("$routeChangeSuccess", function() {
    // handle route changes
    $rootScope.routeChange = true;
    });
});

然后在html：

<main-div ng-if="$root.routeChange"><main-div>

Answer 1

以$ rootScope stateTransition状态存储，并使用以下代码段：

<my-dir ng-if="!$root.transitionInProgress"></my-dir>

Answer 2

我刚刚意识到在检查代码后我做错了什么....当另一个目录被触发时，工厂的returnConfig属性正在路由更改上被覆盖。解决方案是将工厂声明为对象，然后将returnConfig添加为原型属性，使其成为每个指令实例的唯一

stockfront.factory('directiveConfig', function(){

//constructor
function directiveConfig(){

}

directiveConfig.prototype.returnConfig = function (){
    return {
        scope : true,
        restrict: "E",
        replace: true,
        templateUrl : "",
        template : "",
        transclude  : true,
        link  : "",
        combine: ""
    };
};

return directiveConfig;
});


stockfront.directive("mainDiv", function(directiveConfig){
    var obj = new directiveConfig()
    var dirDefault = obj.returnConfig();
    dirDefault.templateUrl = "./template/mainDiv.html";

return dirDefault;

});

在路线改变时重新运行所有角度对象指令（不仅是链接功能）

2 个答案: