angularjs – Angular高亮/选择元素Angular中的所有内容

发布时间：2020-12-17 17:20:28 所属栏目：安全来源：网络整理

导读：我们如何使用Angular JS突出显示并选择元素内的所有内容？使用inputbox很容易.但是我们如何为元素做. 帮助将不胜感激. 谢谢这是我到目前为止使用的. HTML div ng-controller="appController" ng-app="app" input type="text" ng-model="content" ng-click=

我们如何使用Angular JS突出显示并选择元素内的所有内容？
使用inputbox很容易.但是我们如何为元素做.

帮助将不胜感激.

谢谢

这是我到目前为止使用的.

HTML

<div ng-controller="appController" ng-app="app">
    <input type="text" ng-model="content" ng-click="onTextClick($event)" />
</div>

var app = angular.module('app',[]);
  app.controller('appController',function ($scope) {
        $scope.content = 'test';
        $scope.onTextClick = function ($event) {
            $event.target.select();
        };
    });

http://jsfiddle.net/onury/R63u5/

解决方法

jsfiddle： http://jsfiddle.net/n63LhtcL/3/

这是一个实现它的更新指令：

.directive('selectOnClick',function ($window) {
    return {
        link: function (scope,element) {
            element.on('click',function () {
                var selection = $window.getSelection();        
                var range = document.createRange();
                range.selectNodeContents(element[0]);
                selection.removeAllRanges();
                selection.addRange(range);
            });
        }
    }
});

你的标记：

<div select-on-click>
    Some text...
    <input type="text" ng-model="content"  />
</div>

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!