Javascript 如何控制AngularJS中应用属性指令的顺序？_Javascript_Html_Angularjs

Javascript 如何控制AngularJS中应用属性指令的顺序？

javascript html angularjs

Javascript 如何控制AngularJS中应用属性指令的顺序？,javascript,html,angularjs,Javascript,Html,Angularjs,我有两个A指令。我想将它们应用于div元素我试图改变html文件中的顺序。我试图改变JS文件中的顺序。但结果是一样的——首先通知mydirective2，然后通知mydirective1 如何更改订单？我要第一个指令，第二个指令 main.js: var app = angular.module("angularBlackbox", []); app.directive("mydirective1", function () { return { restrict:

我有两个A指令。我想将它们应用于div元素

我试图改变html文件中的顺序。我试图改变JS文件中的顺序。但结果是一样的——首先通知mydirective2，然后通知mydirective1

如何更改订单？我要第一个指令，第二个指令

main.js:

var app = angular.module("angularBlackbox", []);

app.directive("mydirective1", function () {
    return {
        restrict: "A",
        link: function () {
            alert("mydirective1 works!!!");
        }
    }
});

app.directive("mydirective2", function () {
    return {
        restrict: "A",
        link: function () {
            alert("mydirective2 works!!!");
        }
    }
});

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>AngularJS Blackbox</title>
    <link rel="stylesheet" href="css/bootstrap.min.css">
    <link rel="stylesheet" href="css/bootstrap-theme.min.css">
</head>
<body>
<div ng-app="angularBlackbox">
    <div mydirective1 mydirective2></div>
</div>

<script type="text/javascript" src="js/angular.min.js"></script>
<script type="text/javascript" src="main.js"></script>
</body>
</html>

index.html:

var app = angular.module("angularBlackbox", []);

app.directive("mydirective1", function () {
    return {
        restrict: "A",
        link: function () {
            alert("mydirective1 works!!!");
        }
    }
});

app.directive("mydirective2", function () {
    return {
        restrict: "A",
        link: function () {
            alert("mydirective2 works!!!");
        }
    }
});

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>AngularJS Blackbox</title>
    <link rel="stylesheet" href="css/bootstrap.min.css">
    <link rel="stylesheet" href="css/bootstrap-theme.min.css">
</head>
<body>
<div ng-app="angularBlackbox">
    <div mydirective1 mydirective2></div>
</div>

<script type="text/javascript" src="js/angular.min.js"></script>
<script type="text/javascript" src="main.js"></script>
</body>
</html>


AngularJS黑盒

您可以使用文档中的DDO优先级

当在单个DOM元素上定义了多个指令时，有时需要指定应用这些指令的顺序。

优先级

用于在调用指令的

编译

函数之前对指令进行排序。优先级定义为一个数字。首先编译具有更高数值

优先级的指令。前链接功能也按优先级顺序运行，但后链接功能按相反顺序运行。具有相同优先级的指令顺序未定义。默认优先级为0


博客很好地解释了角度指令中的优先级
你对此没有多少控制权。无论您试图完成什么，如果指令的应用顺序很重要，那么您以错误的方式处理问题（在角度上下文中）。如果你想提供更多的细节来说明为什么它很重要，那么我可能会想出一些办法。同时，您可以在第二个指令中输入一个hacky timeout，以确保它对自身进行评估。改变标记的顺序在这里没有帮助，请选中指令configSee下的priority选项。谢谢！我将使用优先级选项。这正是我需要的。谢谢你的帮助！