Question

在我们的代码库中，我们混合了以下内容：

attribute =“$ {something}”，attribute =“$ {something | converter}”等
attribute.bind =“something”，attribute.bind =“something | converter”

我发现后者更容易阅读。

我所指的例子与上述完全相同;即，他们不添加任何额外的字符串内容。

我认为Aurelia也更容易。我是对的吗？

此外，对于没有实际插值的特定情况涉及，第一种形式有什么好处？（除了它输入的两个字符少。）

Answer 1

根据你展示的例子，我建议使用选项2.它真的不容易在Aurelia，＆＃34;但更明确的是，您将该属性的值绑定到列出的属性。

以下原始答案

第一个选项的好处是，例如，当您拥有一个接受许多值但作为单个字符串的属性时。最常见的示例是class属性。 <div class="foo bar baz"></div>属性接受以空格分隔的列表中的多个类：

baz

想象一下，我们只想在离开其他类时，根据我们的VM someProp上的prop添加或删除此列表中的类.bind。要使用baz语法执行此操作，我们必须在我们的VM上创建一个具有完整列表的属性，但添加或删除由someProp的值确定的<div class="foo bar ${someProp ? 'baz' : ''}"></div>。但是使用字符串插值绑定，这变得更加简单：

.bind

您可以想象如何在添加或删除多个类的情况下扩展它。您可以创建一个值转换器来使用<div class.bind="someProp | toggleClass:'baz':'foo':bar'"></div>语法执行此操作，但最终可能会有一些不可读的内容。

我可以想象一个正在创建的值转换器在使用中可能看起来像这样：

export class ToggleClassValueConverter {
  toView(value, toggledClass, ...otherProps) {
    return `${otherProps.join(' ')} ${value ? toggledClass : ''}`;
  }
}

我真的认为这比使用字符串插值语法要差得多。

顺便说一句，我想象的价值转换器看起来像这样：

$temp = array() // global
$id1 = is_num_exists(rand(1,4));
$id2 = is_num_exists(rand(1,4));
$id3 = is_num_exists(rand(1,4));
$id4 = is_num_exists(rand(1,4));

function is_num_exists($id){
  while(in_array($id,$temp)){
    $id = rand(1,4);
  }
  $temp[] = $id;
  return $id
}

最好的部分是我仍然在值转换器中使用字符串插值： - ）

Answer 2

在浏览标签后，我已经打开了，我发现了这个。虽然它不是一回事，而且有点陈旧，但Danyow先生在https://github.com/aurelia/templating-binding/issues/24#issuecomment-168112829上谈到了类似的事情（强调我的）

是的，绑定行为的符号是＆amp; （与值转换器相反）。

<input type="text" data-original="${name & oneTime}" value.bind="name" />

这是编写一次性绑定的标准方法。 在解析和绑定方面，这将更轻量级：

<input type="text" data-original.one-time="name" value.bind="name" />

我不知道它是否适用于.bind / $ {name}案例以及示例中的oneTime案例，但也许如果引起他的注意，他可以说任何一种方式。

鉴于这不是一个简单的答案，我会将Ashley作为答案，因为它确认了易读性问题，并提供有关其他用例的有用信息，如果其他人搜索类似的话术语

.bind vs aurelia中的字符串插值

2 个答案: