javascript - 将变量从控制器范围传递到指令

Question

在我的控制器中，我定义$scope.worker了一个普通的 JS 对象：

{
    name: 'Peter',
    phone: 601002003
}

我创建了一个指令：

.directive('phoneType', [function () {
    return {
        restrict: 'A',
        link: function (scope, element, attrs) {
            console.log(attrs);
        }
    };
}])

我的 HTML 看起来像这样：

<span phone-type="worker.phone"></span>

如何将worker.phone（在本例中为 601002003）从控制器范围传递到指令，以便在方法中创建我的逻辑link？attrs.phoneType现在给我worker.phone看字符串。

Answer 1

您还可以通过两种方式绑定将值传递给指令：

.directive('phoneType', [function () {
    return {
        scope: {
          phoneNumber: '=phoneType'
        }
        link: function (scope, element, attrs) {
            // now do stuff with the number, you can access it through the scope
            scope.phoneNumber // contains the number
        }
    };
}])

现在您可以通过隔离范围直接访问该号码。模板看起来像这样：

<span phone-type="worker.phone"></span>

顺便说一句，您不需要限制 A。这是默认行为。