Question

我正在使用angularjs应用。这是一款适用于手机的聊天应用。它有两个模板

userlist.html
message.html

在message.html模板中，一切正常，直到我按下时说出（<input>标签）“输入”输入内容。键盘显示，它不会向上滑动视图。键盘可见时显示旧消息。所以为了向上滑动视图。我正在考虑在tag的keyup上绑定一个事件，并更改css类以获取更新的视图。所以，我创建了该指令。但问题是当我在<input>标签上添加指令时。我只能访问输入标签的元素。我想在指令中访问模板的完整DOM元素。怎么做？

message.html

<div class="chat-sidebar-content">   element
<div class="chat-sidebar-chat chat-sidebar-panel2" id="chat-sidebar-user-1"> //I want to change class of this 

</div>

<footer class="chat-sidebar-footer form-group">
    <input class="form-control input-dark fs-mini" my-directive type="text"  placeholder="Type your message">    //added the directive here
</footer>
</div>

directive.js

angular.module('testApp').directive('myDirective', function() {


return function(scope, element, attr){

    console.log(element);

    element.bind("keyup", function(){

        console.log('keyup');    //this works
    });
};

});

Answer 1

以下是您可以做的一个示例：

在视图中：

<input class="form-control input-dark fs-mini" ng-keyup="checkSomething()" type="text"  placeholder="Type your message">

在控制器中：

$scope.condition;
$scope.checkSomething = function (){
    $scope.condition = true;
};

在视图中，再次对同一范围内的任何元素（控制器）：

<div ng-class="condition ? 'class-1' : 'class-2' " id="chat-sidebar-user-1">

这只是一个例子，如果您无需检查，请随时将$scope.condition = true;直接放入ng-keyup指令。

更改元素onkeyup的类

1 个答案: