Question

为什么在指令控制器选项中指定控制器时，角度数据绑定不起作用？ $scope.emailInvalid.text通常应该映射到type.text，但就我而言，没有任何内容可以显示。

JS：

.directive('alert', function () {
    return {
        template: '<div>{{type.text}}</div>',
        restrict: 'E',
        scope: {
            type: '='
        },
        controller: function ($scope) {
            $scope.emailInvalid = {
                text: 'Text Alert Two'
            };
        }
    };
});

HTML：

<alert type="emailInvalid"></alert>

当我定义一个单独的控制器并在HTML中使用ng-controller传递它时，一切都按预期工作。

这是plunker。

Answer 1

由于您想要显示type.text，您需要定义

$scope.type = {
    text: 'Text Alert Two'
};

指令控制器中的

。通过这样做，您不必将对象传递给指令。

PLUNKR

Answer 2

好的，我找到了解决方案：

问题在于将$scope.emailInvalid映射到$scope.type时角度失败。我在<alert type="emailInvalid"></alert>的示例中所做的是将对象emailInvalid传递给指令。 Angular正在我使用该指令的范围模型中查找此对象。显然，这个物体不存在，角度不能映射任何东西。

我缺少的部分是，我使用指令控制器选项定义的控制器定义在与ng-controller使用的控制器不同的范围内。

要解决此问题，我现在传递一个字符串而不是一个对象，并使用switch / case来映射警报类型。

plunker

Angular.js：数据绑定不能与指令控制器选项一起使用

2 个答案: