如何编译HTML表单模板HTML字符串

Question

我有这样一个对象：

$scope.item ={ 
     fieldName:'First Name', 
     fieldModel:'user.firstname', 
     placeholder:'enter your name' 
    } 

，我想编译这个HTML表单模板是这样的：

<script type="text/ng-template" id="input.html"> 
    <div class="items form-group"> 
     <label class="col-sm-2 control-label"> 
      {{item.fieldName}} 
     </label> 
     <div class="col-sm-10"> 
      <input type="text" ng-model="{{item.fieldModel}}" placeholder="{{item.placeholder}}" class="form-control"> 
     </div> 
    </div> 
</script> 

到HTML字符串使用纯HTML设计：

<div class="items form-group"> 
    <label class="col-sm-2 control-label"> 
     First Name 
    </label> 
    <div class="col-sm-10"> 
     <input type="text" ng-model="user.firstname" placeholder="enter your name" class="form-control"> 
    </div> 
</div> 

Answer 1

您可以包括您的模板搭配：

<div id="tpl-content" ng-include src="input.html"></div> 

，但您的模板应该是：

<script type="text/ng-template" id="input.html"> 
<div class="items form-group"> 
    <label class="col-sm-2 control-label"> 
     {{item.fieldName}} 
    </label> 
    <div class="col-sm-10"> 
     <input type="text" ng-model="item.fieldModel" placeholder="{{item.placeholder}}" class="form-control"> 
    </div> 
</div>