angularjs - 如何将更多值从我的 HTML 传递到指令内部？

Question

我有一个指令：

app.directive('testDir', [function () {
    return {
        require: '?ngModel',
        link: function ($scope, elm, attr, ngModel) {
            var abc=<some string passed from the html>;
        }
    };
}])

我希望指令是这样的：

<div testDir='abcd'>xx</div>

在我的指令中如何读取值“abcd”？

Answer 1

您可以从您的attr

app.directive('testDir', [function () {
    return {
        require: '?ngModel',
        link: function (scope, elm, attr, ngModel) {
            var abc=attr.testDir;
        }
    };
}]);

或者通过创建一个隔离范围（使用 `test-dir="'test'"）

app.directive('testDir', [function () {
    return {
        require: '?ngModel',
        scope: {
           testDir : "="
        },
        link: function (scope, elm, attr, ngModel) {
            var abc=scope.testDir;
        }
    };
}]);

注意：你<html/>错了，你test-dir不需要testDir

<div test-dir='abcd'>xx</div>

Answer 2

通过attrs变量（链接过程中的第三个参数）。

var abc =  attr.testDir

如果你需要传递一个 AngularJS 上下文变量，那么你需要使用 $parse。

var abc= $parse(attr.testDir)(scope)