【问题标题】:Aurelia `@dynamicOptions` mixed with `@bindable`sAurelia `@dynamicOptions` 与 `@bindable`s 混合
【发布时间】:2019-01-05 11:00:50
【问题描述】:

我正在使用 aureliajs 进行开发。到目前为止,我正在处理一个已标记为具有动态选项的自定义属性。例如考虑以下代码:

  import {dynamicOptions, inject} from 'aurelia-framework';

  @dynamicOptions
  @inject(Element)
  export class SquareCustomAttribute {
    constructor(element){
      this.element = element;
    }

    propertyChanged(name, newValue, oldValue){
      switch(name){
        case 'fill':
          this.element.style.backgroundColor = newValue;
          break;
        case 'size':
          this.element.style.width = this.element.style.height = `${newValue}px`;
          break;
        default:
          this.element.style[name] = newValue;
          break;
      }
    }
  }

现在例如考虑我想给属性填充,defaultBindingMode 的 twoWay,所以我将尝试在类中添加 @bindable 属性。所以代码会变成这样:

  import {dynamicOptions, inject} from 'aurelia-framework';

  @dynamicOptions
  @inject(Element)
  export class SquareCustomAttribute {
    @bindable fill;

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

    propertyChanged(name, newValue, oldValue){
      switch(name){
        case 'fill':
          this.element.style.backgroundColor = newValue;
          break;
        case 'size':
          this.element.style.width = this.element.style.height = `${newValue}px`;
          break;
        default:
          this.element.style[name] = newValue;
          break;
      }
    }
  }

绑定停止工作。

  1. 那么,第一个问题是如何为dynamicOptions设置defaultBindingMode?​​p>

  2. 还有一个小问题。正如aurelia.io 所说,Binding to a dynamic options attribute works exactly the same as binding to an options attribute in the DOM.。根据这句话,我希望在optionsChanged 方法上绑定动态选项破折号并检索驼峰式大小写。但是破折号分隔选项从视图中绑定,接收破折号分隔和骆驼,骆驼。根据aurelia.io 的引用句子,这是否正确?

【问题讨论】:

标签: dynamic options custom-attributes aurelia


【解决方案1】:

感谢@bigopon,此问题正在this issue 中跟进,我认为在对 aurelia-framework 进行更改之前,对此问题的任何其他评论都是有益的。

【讨论】:

    猜你喜欢
    • 2016-04-17
    • 2017-08-24
    • 1970-01-01
    • 1970-01-01
    • 2023-04-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2014-08-25
    相关资源
    最近更新 更多