小编Mat*_*vis的帖子

在我的durandal应用程序中,除主页之外的每个页面都有一个左侧导航栏.这个左侧导航栏应该在刷新时更新,但它应该驻留在shell.html上.

问题是我无法在主页上正确隐藏它.当我在主页上时,我可以使用jquery hide()方法隐藏leftnav div,但问题是我只能在data-bindind之后使用jquery代码,直到我可以看到导航栏.我试图使用durandal组合,但我不知道如何只在主页中隐藏导航栏,因为我不知道如何知道我是否在主页上或不在shell.js内.

任何想法？

我有一个列表,我绑定到一个选择,依赖于另一个绑定到不同选择的值.它们与ValueConverter捆绑在一起:

<option repeat.for="site of sites | filter: { project: project }">
  ${site.name}
</option>

现在,这可能会过滤掉所有内容.在这种情况下,我想显示一个选项'No Sites Available'.我尝试过做一个性感的css方法:

<option class="if-empty">No Sites Available</option>

.if-empty { 
  display: none;
}
.if-empty:only-child {
  display: initial;
}

唯一的问题是当从空切换 - >非空,但不是列表中的选项时,在选择中仍然选择"无可用站点"选项.我需要摆脱它.接下来的想法是利用Aurelia的if.bind,但我似乎无法绑定ValueConverter的输出(出于显而易见的原因).

<option if.bind="sites == null | filter: { project: project }">No Sites Available</option>

我有以下代码:

@computedFrom(['id', 'isDiscontinued'])
get disableAdd(){
    return this.id === '0' || this.isDiscontinued;
}

这引发以下错误:奥里利亚-binding.js:2580遗漏的类型错误:this.input.charCodeAt不是一个函数

但这有效:

@computedFrom('id')
get disableAdd(){
    return this.id === '0' || this.isDiscontinued;
}

但我需要两个computedFrom字段,我做错了什么？

我在转发器中有一个HTML元素,我想根据四个条件更改类.该条件基于JSON的属性.该属性称为type,和我一起工作的CSS类的red,blue和green.The条件是:

1. if type= red然后分配css类red
2. 如果type=蓝色则分配css类blue
3. 如果type=绿色,则分配css类green
4. 如果type未定义或null,则分配css类red

由于我对AngularJS的经验有限,我知道我可以使用该ng-style属性设置条件CSS .我如何使用Aurelia实现这一目标？

示例HTML标记

<div repeat.for="item of projects" class="col-lg-6">
    <div class="card-header">
        <!-- I want to change the css class red based on the value of the JSON attribute type -->
        <div class="component-type red">
            ...
        </div>
    </div>
    ...
</div>

我正在构建一个拖放工作区，类似于您发现的用于制作模型的工作区。我有一个工作区自定义元素，它有一个更大的嵌套元素，可以缩放和平移。因此，我需要仔细跟踪工作区的大小和位置数据以及所有包含的元素。

在我的自定义元素的附加事件中，我以编程方式将工作区的高度和宽度设置为 JavaScript 对象，该对象绑定到视图中的 css：

工作区CustomElement.js

export class WorkspaceCustomElement {

    constructor(element) {
        this.element = element;
    }

    attached() {
        this.workspace.size = {
            height: this.element.height * 5,
            width: this.element.width * 5
        }
    }
}

工作空间CustomElement.html

<div css="height: ${workspace.height}px; width: ${workspace.width}px; 
    left: ${(element.clientWidth - workspace.width)/2}px; 
    top: ${(element.clientHeight - workspace.height)/2}px;"></div>

现在我在尝试获取子元素的位置时遇到了问题。我也在它们上面附加了回调，但是它们在上面附加的回调之前被评估，所以 css 绑定没有被评估，并且大小和位置是错误的。

我需要添加一个回调后的attached()进行了评估，并绑定已更新。我可以通过使用setTimeouthack来实现这一点，但我不相信这会一直有效。

attached() {
    this.workspace.size = {
        height: this.element.height * 5,
        width: this.element.width * 5
    }

    setTimeout(() => {
        let components …

在经典的.NET应用程序中,我设置了本地IIS来运行指定的应用程序.我可以构建应用程序并点击端点以立即查看更改.我不需要每次都启动调试器.我想用.NET核心使用Kestrel服务器来实现这一点.

我可以通过从命令行运行来运行我的应用程序dotnet run.但是,当我尝试构建时,文件正在使用中,并且构建失败.是否有任何开发配置选项不会锁定文件而只是根据需要运行它们,允许我立即构建和测试更改？

我想在Aurelia中实现一个简单的拖放操作,但似乎无法触发drop事件.

<template>
<div class="container">
    <div class="row">
        <div draggable="true" dragstart.delegate="dragStart($event)">Drag Me</div>
    </div>
    <div class="row">
        <div class="upload-drop-zone" dragenter.delegate="dragEnter($event)" drop.delegate="dragDrop($event)">Drop Area</div>
    </div>
</div>

export class DemoPage {
 dragStart(event) {
    console.log('dragstart', event);
    return true;
}

dragEnter(event) {
    console.log('dragEnter', event);
    return true;
 }

 dragDrop(event) {
    console.log('dragDrop', event);
    return true;
 }
}

任何帮助表示赞赏 - 谢谢.马特

我正在尝试设置标题,但是在下面的代码中它可以在一个地方工作而在其他地方不起作用.我想获得产品名称并设置标题.还有其他办法吗？

activate(params: any, route, navigationInstruction) {       
        //route.navModel.router.title="test"; //works here
         this.api.pull<Product>([params.id]).then(items => {
                items.forEach(item=>
                {
                    if(item.id == params.id)
                        route.navModel.router.title = item.name //does NOT work here
                });

         });
    }

我正在尝试在Aurelia中构建自定义元素.在这一点上,这就是我所拥有的:

item.html

<template>
    <span>${someProperty}</span>
</template>

item.ts

import {bindable} from 'aurelia-framework';
class Item {
    @bindable someProperty: string;
}

parent.html

<template>
<require from="./item"></require>
<item repeat.for="item of items"></item>
</template>

parent.ts

class Parent {
    items: Item[];

    loadItems() {
        // at this point, I'm sure that items is getting populated.
        this.items = dataservice.loadItems();
    }
}

我似乎无法在涵盖此方案的文档中找到任何内容.我得到的是,跨度是空的.我在控制台中没有收到任何错误.我是以正确的方式来做这件事的吗？

我知道我可以在Visual Studio或Visual Studio Code中配置一些设置,以便在开发模式下启动我的asp .net核心应用程序.但是我对所有构建工具都有过糟糕的体验,到目前为止从命令行运行是唯一一个为我工作的人.

我在命令行中遇到的一个大问题是让它在开发模式下运行.如果我理解,这只能通过set ASPNETCORE_ENVIRONMENT=Development在之前键入dotnet watch run或通过设置系统范围的环境变量来完成.还有另一种方式,比如通过文件或其他方式.

如何从命令行在开发模式下运行,所以我可以将其包含在package.jsonAurelia项目中？

我有一个自定义属性来处理身份验证数据,并根据说明做一些有趣的事情.

<div auth="disabled: abc; show: xyz; highlight: 123">

这里发生了许多复杂,微妙的事情,将它与语义绑定分开是有意义的disabled.bind.但是,一些元素也将具有应用程序逻辑级绑定.

<div auth="disabled.bind: canEdit" disabled.bind="!editing">

在封面下,我的auth属性查看登录用户,确定用户是否具有正确的权限,并根据结果采取正确的操作.

disabledChanged(value) {
    const isDisabled = this.checkPermissions(value);
    if (isDisabled) {
        this.element.disabled = true;
    }
}

此结果需要覆盖其他绑定,这些绑定可能存在也可能不存在.理想情况下,我想查找现有的Binding并覆盖它的ala绑定行为.

constructor(element) {
    const bindings = this.getBindings(element); // What is the getBindings() function?
    const method = bindings['disabled']
    if (method) {
        bindings['disabled'] = () => this.checkPermission(this.value) && method();
    }
}

问题是这个getBindings(element)功能是什么？如何访问元素上的任意绑定？

编辑:请点击这里:https://gist.run/ ？ id = 4f2879410506c7da3b9354af3bcf2fa1

有一些关于谷歌地图api正确居中问题的帖子.我了解以下调整地图的大小:

google.maps.event.trigger(map, 'resize');

我能够在第一页显示的div元素内正确显示地图.但是,当导航回保存地图的html页面时,div中只显示一小部分地图.我遇到的问题是弄清楚如何合并这个调整大小的触发器.我是SPA和Durandal的新手,这是我负责地图的viewmodel:

define(['async!https://maps.googleapis.com/maps/api/js?v=3.exp&sensor=false'], function () {
    var vm = {
        title: 'Home View',
        attached: initialize,
        activate: function () {
            toastr.success('Map View Activated');
        }

    }; 
    return vm;

    function initialize() {
        var mapOptions = {
            zoom: 10,
            center: new google.maps.LatLng(-34.397, 150.644),
            mapTypeId: google.maps.MapTypeId.ROADMAP
        };

        map = new google.maps.Map(document.getElementById('map-canvas'), mapOptions);
    }
});

我们需要将我们的WPF应用程序迁移到Web,并且我将Aurelia框架与各种其他框架(包括Angular 1,Angular 2和React)进行比较.我们需要在6-7个月内发布它.

虽然我读过许多赞成Aurelia而非其他框架的文章,但我担心Aurelia是否已为生产开发做好准备.Aurelia目前仍处于测试阶段,因此我担心会发生变化.此外,嗡嗡声主要围绕上面提到的其他框架,所以我担心Aurelia变得不受支持或Aurelia开发人员变得难以找到.Aurelia是生产应用的可行选择吗？