Input 如何将材料输入的点击区域扩展到其容器？

我们注意到许多用户试图点击实际输入之外的区域。由于在

mdInputContainer

上没有单击侦听器，因此不会发生任何事情，用户认为他们无法键入输入：-（我想出了一种将点击区域扩展到整个

mdInputContainer

的方法，但我希望能使用更好的方法，比如装饰现有指令或类似的东西。如何将

输入的点击区域扩展到
mdInputContainer
？

以下是我所做的工作，但似乎是错误的：

.directive('mdInputContainer', mdInputContainer);

function mdInputContainer() {
    return {
        restrict: 'E',
        require: 'mdInputContainer',
        link: link
    };

    //////////////////////////////////////////////////////////////////

    function link(scope, element, attrs, mdInputContainerCtrl) {
        element.on('click', function () {
            mdInputContainerCtrl.delegateClick();
        });
    }
}

改变css不是最好的选择吗？我不确定你如何通过简单地改变容器上的css来触发所有输入的点击行为。你能给我一个例子来说明你的意思吗？我的意思是只在输入上添加一个填充。好吧，填充不是真正的问题。你看到材料输入了吗？这里是一个演示just以防万一：这与大多数用户感到舒服的东西非常不同（不幸的是，因为它们真的很漂亮）哦，我明白了！我从来没有使用过angular，所以我帮不了什么忙，但是如果你上面的代码是功能性的，那么它看起来足够短，并且很容易解释，我觉得你确实找到了一个很好的解决问题的方法。我不会担心它，特别是在解释为什么会有代码的时候。