小编pow*_*uoy的帖子

我正在尝试允许我的用户按我的不同自定义字段对搜索结果进行排序.

我正在使用pre_get_posts过滤器,一切正常,除了一件事.

我遇到的问题是,当使用自定义字段进行排序时,只有具有该自定义字段集的帖子才会显示在搜索中.

显然,当用户更改如何对搜索结果进行排序时,搜索结果的数量会发生变化,因此这是不可接受的.

我想要的是具有自定义字段的帖子按顺序首先显示,然后其余帖子显示按日期排序.

这是我的相关代码:

<?php
add_filter('pre_get_posts', 'h5b_search_pre_get_posts');

function h5b_search_pre_get_posts ($qry) {
    $validOrders    = array('price', 'date', 'popularity');
    $orderBy        = (isset($_GET['myorder']) and in_array($_GET['myorder'], $validOrders)) ? $_GET['myorder'] : 'price';

    if ($qry->is_main_query() and $qry->query_vars['s'] != '') {
        # This only includes the posts that have "item_price" set
        if ($orderBy == 'price') {
            $qry->set('orderby', 'meta_value_num date');
            $qry->set('order', 'ASC DESC');
            $qry->set('meta_key', 'item_price');
        }
        # This works fine and includes all posts (obviously)
        elseif ($orderBy == 'date') {
            $qry->set('orderby', 'date');
            $qry->set('order', …

我创造了一个超级简单的手风琴,我使用h3/ psetup和ps最初有,max-height: 0但如果h3有一个.open类p得到类似max-height: 100px(h3.open + p {max-height: 100px}).

然后我使用几行jQuery将open类添加到单击的h3.

我遇到的问题是,当我点击标题时,它首先会滑出,然后半秒后另一个向后滑动.为什么转换不是在同一时间执行？

这是一个小提琴:http://jsfiddle.net/2uhVY/

以下是所有代码:

HTML

<div class="accordion">
    <h3>Some question</h3>
    <p>Some answer</p>
    <h3>Some question</h3>
    <p>Some answer</p>
    <h3>Some question</h3>
    <p>Some answer</p>
    <h3>Some question</h3>
    <p>Some answer</p>
</div>

CSS

.accordion {

}

.accordion h3 {
    margin: 0;
    cursor: pointer;
}

.accordion p {
    margin: 20px 0;
    max-height: 0;
    overflow: hidden;
    -webkit-transition: max-height …

通常当我创建一个自定义元素时,我将其包装在一个section或其他适当的HTML元素和样式中,但这会导致DOM看起来像custom-element > section.

我的问题是,删除section并简单地将其custom-element视为根元素和样式是错误的吗？

例如,我有一个自定义元素调用tabs,现在当它使用DOM结束时看起来像,tabs > div.tabs但我更愿意删除该div.tabs元素,如果没有任何问题.

所以我的问题是设置我的自定义元素并将它们视为任何其他HTML元素是"错误的",或者我应该继续完全忽略我的自定义元素(即使在使用>和其他选择器时很难这样做)？

我已经在路由器中添加了一个授权管道步骤.一切正常,但是当我使用Redirect该类将用户指向登录页面时,它会将URL作为其参数.如果我使用的话,我更愿意传递路线名称Router.navigateToRoute().这可能吗？

@inject(AuthService)
class AuthorizeStep {
    constructor (authService) {
        this.authService = authService;
    }

    run (navigationInstruction, next) {
        if (navigationInstruction.getAllInstructions().some(i => i.config.auth)) {
            if (!this.authService.isLoggedIn) {
                return next.cancel(new Redirect('url-to-login-page')); // Would prefer to use the name of route; 'login', instead.
            }
        }

        return next();
    }
}

我正在尝试获取元素,innerText但Chrome返回一个空字符串,因为我的元素是隐藏的.

Firefox没有.

innerText即使元素不可见,有没有办法在Chrome中检索？

console.log(document.querySelector('div').innerText + ':' + document.querySelector('div').innerHTML);

div {
  height: 0;
  overflow: hidden;
}

<div>
Hello, I'm <strong>empty!</strong>
</div>

老实说,我真的很惊讶Chrome的表现如此,这是一个错误吗？

https://jsfiddle.net/r8q2znc4/

我正在用Aurelia构建一个应用程序,并且到目前为止真的很喜欢这个框架,但是我偶然发现了一个问题,我试图显示一个复选框列表,其值为数字(ID:s实际上),Aurelia似乎将它们转换为字符串,因此比较失败.

我基本上有类似的东西:

export class MyVm {
    constructor () {
        this.items = [
            {name: 'Foo', id: 0},
            {name: 'Bar', id: 1},
            {name: 'Baz', id: 2}
        ];
        this.selectedItems = [0, 2];
    }
}

在我看来:

<ul>
    <li repeat.for="item of items">
        <input type="checkbox" value.bind="item.id" checked.bind="selectedItems">
        ${item.name}
    </li>
</ul>

为了实现这一点,我实际上必须做的this.selectedItems = ["0", "2"]只是导致我自己的代码中的一堆其他比较问题.我也不希望以后在保存数据时将所选项目作为字符串发送到服务器.

我已经尝试使用一个简单的值转换器转换为toString toView和parseInt fromView,但我无法在selectedItems数组上运行此转换器:

export class IntValueConverter {
    toView (val) {
        return val.toString();
    }

    fromView (val) {
        return parseInt(val);
    }
}

你会怎么解决这个问题？

我知道Aurelia允许我们Promise()从VM的activate()方法返回一个,如果是这样,它将等待承诺解决,然后切换到新视图.

但是,假设我有一个由一个或多个子组件组成的视图,并且它们都发出HTTP请求,我怎么知道所有子组件何时从我的父组件中完成？

额外问题:只有<router-outlet>使用该activate()方法的VM 才是正确的,而用作自定义元素的VM使用该attached()方法是正确的吗？

编辑:稍微详细说明,这是我的一个页面/路线/主要视图可能是什么样子:

<template>
    <main>

        <section id="item">

            <h1>${item.title}</h1>

            <img src="${item.image}">

            <p>${item.description}</p>

            <ul>
                <li repeat.for="si of item.subItems">
                    ${si.subItem}
                </li>
            </ul>

        </section>

        <aside>

            <author-info></author-info>
            <recent-items limit="3"></recent-items>
            <random-quote></random-quote>

        </aside>

    </main>
</template>

我可以轻松地等待${item}加载,然后在主视图的activate方法中解析promise ,但这并不能保证aside已加载的三个子元素.这使它们一个接一个地弹出,看起来不太好.

如果可能的话,我非常想使用Aurelia的内置功能,但我想我可能不得不使用EventAggregator或像Ashley建议的双向绑定来使用我自己的加载器.

很想听听Aurelia团队的人是否有可能这样做？

我所知道的click.trigger,以及click.delegate其做工精细.但是,如果我想分配一个click事件,只有在点击具有该属性的确切元素时才会触发该怎么办？

我可能会做这样的事情,因为它是"正常的"JS:

el.addEventListener('click', function (e) {
    if (e.target === el) {
        // continue...
    }
    else {
        // el wasn't clicked directly
    }
});

是否已经存在这样的属性,或者我是否需要自己创建一个属性？如果是这样,我希望它与其他类似,类似于click.target="someMethod()".我怎么能做到这一点？

编辑:我尝试过这个不起作用,因为回调函数this指向自定义属性类 - 而不是使用属性类的元素;

import { inject } from 'aurelia-framework';

@inject(Element)
export class ClickTargetCustomAttribute {
    constructor (element) {
        this.element = element;

        this.handleClick = e => {
            console.log('Handling click...');

            if (e.target === this.element && typeof this.value === 'function') {
                console.log('Target and el are same and value is function …

我正在努力理解以下 CSS 变量，我相信代码本身就说明了一切，否则请告诉我。

:root {
    --color: red;
    --hover-color: var(--color);
}

div {
    --color: green;

    background: var(--color);
}

div:hover {
    background: var(--hover-color);
}

<div>
Why am I red on hover? Shouldn't I be green? When inspecting this element on hover, chrome shows the green color!?
</div>

让我感到绝对困惑的是，当检查 Chrome Devtools 中的元素时，它显示悬停颜色为绿色？

我正在尝试route-href在项目列表中动态生成a .我基本上有这个:

this.items = [
    {
        name: 'Foo',
        route: 'item',
        routeParams: {
            id: 1
        }
    },
    {
        name: 'Bar',
        route: 'item',
        routeParams: {
            id: 2
        }
    }
];

在我看来:

<ul>
    <li repeat.for="item of items">
        <a route-href="route: ${item.route}; params.bind: ${item.routeParams}">
            ${item.name}
        </a>
    </li>
</ul>

但Aurelia告诉我:

aurelia-logging-console.js:54 ERROR [route-href] Error: A route with name 'undefined' could not be found. Check that `name: 'undefined'` was specified in the route's config

如果我打印${item.route}并且${item.routeParams}它们确实包含正确的值:

<ul>
    <li repeat.for="item of items">
        <a …