小编Ash*_*wal的帖子

我使用以下代码片段来促进我的同位素实现的实时搜索.

它工作得很好,但我想知道是否有办法限制它搜索的范围.

我们的同位素返回HTML如下:

<div class="item">
<span class="title"></span>
<span calss="description"></span>

现在它搜索所有内容,我如何限制它只过滤"标题"字段的结果？

jQuery(document).ready(function($) {
    $(document).ready(function(){

        var $container = $('#portfolio'),

        // create a clone that will be used for measuring container width
        $containerProxy = $container.clone().empty().css({ visibility: 'hidden' });   

        $container.after( $containerProxy );  

        // get the first item to use for measuring columnWidth
        var $item = $container.find('.portfolio-item').eq(0);
        $container.imagesLoaded(function(){
            $(window).smartresize( function() {

                // calculate columnWidth
                var colWidth = Math.floor( $containerProxy.width() / 5 ); // Change this number to your desired amount of columns

                // …

我正在将代码从Angular 1.3迁移到Angular 1.5组件和ES6控制器.我试图在这里找到一些东西,但没有足够的帮助.除了下面提到的方式之外,如何在范围内观看事件所需的建议.或者如何从指令触发范围事件.如果存在替代方案,也请建议正确的方法.

Angular 1.3

angular
.module('test')
.directive('test', function() {
    return {
        link: function(scope) {
            scope.$on('$stateChangeStart', function(event, toState, toParams) {
                //logic goes here..
            });
        }
    }
});

Angular 1.5/ES6

class TestController {
    /* @ngInject */
    constructor($scope) {
        this._$scope = $scope;
    }

    $onInit() {
        this._$scope.$on('$stateChangeStart', (event, toState, toParams) => {
            //logic goes here
        });
    }
}

angular
.module('test')
.component('test', {
    controller: TestController
});

编辑:

有兴趣选择$ on而不是$ watch,因为$ onChange可以在你看变量时替换$ watch.我想听范围事件,因为不是100%的angular 1.3代码可以迁移到1.5,我仍然有指令触发范围上的事件!

合成触发点击不会导致焦点切换到元素，但是硬件触发的点击会。

我正在尝试模拟对一个元素（比如带有 tabindex 的 div）的合成点击，该元素在焦点上有一个回调绑定。我不想显式调用该元素的焦点，因为该元素可以通过单击或键盘选项卡获得焦点。

我的JSFiddle

代码：

$('button.trigger').click(function(){
    $('div#target').trigger('click');
});

$('button.trigger1').click(function(){
    var event = new MouseEvent('click');
    var target = document.getElementById('target'); 
    target.dispatchEvent(event);
});

$('div#target').click(function(){
    $(this).addClass('selected');
});

HTML :

<div id="target" tabindex="-1"></div>
<button class="trigger">Click to trigger click</button>
<button class="trigger1">Click to dispatch click</button>

CSS :

div{
    height:100px;
    width:100px;
    border:10px solid black;
}

#target:focus{
    background-color:#aaa;
}
.selected{
    border-color:red;
}