Angular.js:数据绑定不适用于指令控制器选项

Question

当我在指令控制器选项中指定控制器时，angular的数据绑定为什么不起作用？$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传递它时，一切都像预期的那样工作。

这是一个灌篮器。

Answer 1

由于要显示type.text，因此需要定义

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

在指令控制器中。通过这样做，您不必将对象传递给指令。

柱塞

Answer 2

好吧，我找到了一个解决方案：

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

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

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

plunker