什么是减少angularjs中表单元素属性重复的最佳方法？

我正在设计一个AngularJS 1.5.x应用程序，它会为每个表单提供大量的表单和大量的字段。我发现，我不停地重复属性有很多，例如：什么是减少angularjs中表单元素属性重复的最佳方法？

<div class="form-group"> 
    <label class="control-label" for="thing.Field1">Field 1</label> 
    <input class="form-control ctrl-md" 
      type="text" 
      id="thing.Field1" 
      name="Field1" 
      ng-model="thing.Field1" 
      ng-maxlength="30" 
      required 
      uib-tooltip="Field 1 is required" 
      tooltip-placement="right" 
      tooltip-trigger="none" 
      tooltip-is-open="thingForm1.Field1.$invalid && showValidationErr('Thing1')" 
      ng-blur="fieldBlur('Thing1')">  
</div>

我试图用一个指令+模板，它的工作或多或少，但它似乎非常复杂和缓慢的。

有没有一种很好的方法使input可重复使用？或者我应该习惯于在编辑器中进行大量的复制+粘贴操作？

除了减少重复编码之外，如果我想在所有字段上更改工具提示位置，则可以更改一个地方的所有元素，这是非常好的。

来源

2016-09-12 Pippin

有很多方法。看看这个库http://angular-formly.com/。在我的项目中，我只使用普通输入和写入指令来处理复杂的情况，例如2场控制。或像卡片有效期的特殊领域。

UPDATE

好吧，看看这个PLS。 Angular: better form validation solution

你有3个解决方案：

要保存您的属性，因为它是。
在一个指令中存储一组通常一起使用的属性。或者使用利用数组属性的指令。像我的例子中的验证指令一样。
使用指令与transclusion利用第1和第2种方法。所以你可以在一个地方交换元素的位置（如标签，输入控件，错误提示）。另外，您可以轻松创建此指令的属性，如preset，并将属性预设存储在该指令中。

因此，正如我已经告诉过的，有很多方法可以减少属性重复次数。

来源

2016-09-12 21:11:39 Kindzoku

感谢您的回答。我看着Formly，我宁愿这样做1）不添加依赖关系，2）不将设计元素从HTML移动到JS。此外，除了减少重复编码之外，如果我想更改工具提示位置，则可以在一个位置更改所有元素，这是非常好的。（我会更新这个问题来添加这个。） – Pippin

@Pippin，我已经更新了我的答案。 – Kindzoku

谢谢@Kindzoku。我接受了答案，但无法赞成。 :(在玩过你提到的一些选项后，我决定坚持使用copypasta（实际上是编辑器代码片段和自动代码生成器），指令方法感觉太脆弱和缓慢 – Pippin

什么是减少angularjs中表单元素属性重复的最佳方法？

回答

相关问题