3

我有这段代码，它允许用户在项目列表上留下评论。我创建了一个指令并收听 keydown 以便让用户在keyCode == 13.

不确定我是否应该包含在指令中发表评论的代码。在控制器和指令之间进行通信的最佳方式是什么？

在提交评论之前，我还会检查输入是否为空。它可以工作，但不确定这是 Angular 的最佳实践吗？

这是我的笨蛋。

4

3 回答 3

4

如果你想使用 ng-keydown.. 你不需要写指令

例子：

模板：

<input type="text" ng-model="myText" ng-keydown="checkKeyCode($event)">

控制器： -- 用咖啡脚本编写

$scope.checkKeyCode = ($event)->
  if $event.keyCode == 13 and $scope.myText?
    $scope.doSomething()
于 2013-07-30T17:45:40.443 回答
3

您通常不希望您的指令知道有关您的控制器的任何信息，因此在控制器和指令之间进行通信的最佳（Angular）方式是通过双向绑定。

在您的情况下，我认为最好的做法是再次为 IMO 创建一个指令，而不是输入。您会告诉按钮要监视哪个“输入”（按 id）。就像是：

<input id="input-{{item.id}}" type="text" ng-model="currMessage" />
<button class="btnMessage" ng-click="addMessage(currMessage, item)" default-input="input-{{item.id}}">Add</button>

ETA：这就是指令最终的样子

http://plnkr.co/edit/HhEAUUq0IZvzblbRksBH?p=preview

myApp.directive('defaultInput', function () {
    return {
        restrict:'A',
        link: function(scope, element, attrs) {
            attrs.$observe('defaultInput', function(value) {
                var inputElement = angular.element(document).find('#' + value);
                inputElement.bind('keydown', function(e) {
                    if (e.keyCode == 13) {
                        element.click();
                    }
                });
            });
        }
    };
});

它可能会变得棘手，因为$observe每次控制器scope.items更改时都会触发回调，因此您需要以某种方式取消绑定和重新绑定（我知道您使用的是 jQuery，但我angular.unbind在文档中没有看到）。

另一种选择，如果您想更接近原来的方法：

http://plnkr.co/edit/3X3usJJpaCccRTtJeYPF?p=preview

HTML

<input id="input-{{item.id}}" type="text" ng-model="currMessage" enter-fires-next-button />

JavaScript

myApp.directive('enterFiresNextButton', function() {
  return function(scope, element, attrs){
    element.on('keydown', function(e){
      if(e.keyCode == 13) {
        element.next('button').click();
      }
    });
  }
});
于 2013-05-08T20:02:24.833 回答
1

在控制器和指令之间进行通信的最佳方式是什么？

这取决于... 我喜欢首先确定哪种类型的范围适用于指令：没有新范围、新范围或新隔离范围。请参阅在 AngularJS 中编写指令时，我如何决定是否需要新的范围、新的子范围或新的隔离范围？

一旦决定了，下一个决定就是确定通信是否真的应该发送到服务。如果是这样，控制器和指令将同时注入服务并与之交互，而不是彼此交互。

如果不需要服务，则使用属性来促进控制器和指令之间的通信。如何完成取决于指令创建的范围类型。提示：如果没有使用隔离作用域，请使用它$parse来获取和设置指令内的属性，或者从指令内调用控制器上的方法——请参阅

于 2013-05-08T23:01:51.080 回答