textArea在angular js中的双向绑定

我有一个用户必须回答的问题列表。为此，我准备了一个表单。textArea在angular js中的双向绑定

HTML表单是

<div class="list" ng-repeat="question in questions.data.Question" > 
     <div class="item item-divider"> 
     {{question.text}} 
    </div> 
    <label class="item item-input" ng-if="question.type =='comment'"> 
     <textarea placeholder="Comments"></textarea> 
    </label> 
</div>

现在我的JSON字符串是

{ 
    "sucess": true, 
    "message": "record(s) fetched sucessfully", 
    "data": { 
     "Question": [ 
      { 
       "id": "4", 
       "text": "how was it?", 
       "type": "comment" 
      }, 
      { 
       "id": "6", 
       "text": "how was it?", 
       "type": "comment" 
      } 
     ] 
    } 
}

现在，当用户提交表单我应该得到的评论用户已张贴的所有问题。

来源

2014-06-06 Aks

你的问题是什么？什么不起作用？你有什么尝试？ – StuR

我希望用户在点击提交按钮时发布的所有问题的答案。 – Aks

我不是角度专家，但我认为你需要将ng模型添加到textarea元素。

<div class="list" ng-repeat="question in questions.data.Question" > 
     <div class="item item-divider"> 
      {{question.text}} 
     </div> 
     <label class="item item-input" ng-if="question.type =='comment'"> 
      <textarea placeholder="Comments" ng-model="question.comments"></textarea> 
     </label> 
</div>

而且，您还需要为每个评论类型问题添加“评论”字段。例如：

 { 
      "id": "6", 
      "text": "how was it?", 
      "type": "comment", 
      "comments": "" 

     }

注意，你可能并不需要，如果有一个增加“意见”场“力加场”标志，我是不知道的angularjs。

来源

2014-06-06 10:26:37 holgac

但想要在其他模式中发布它不在同一服务 – Aks

这个提交按钮有什么作用？提交表格？你是否在该表单中添加了ng-submit指令？如果您想提交用户发布的所有评论，则只需在控制器中的ng-submit调用函数中发送模型即可。当您放置DOM元素的模型发生变化时，模型会自动更新。 – holgac

没有按钮的ng-clik我已经调用了传递模型的函数 – Aks

您必须将ng-model绑定到textarea，即使您在初始json数据中没有“answer”变量，它也可以工作。我添加了一个用于演示目的的按钮。 JSFIDDLE

<div id="qApp" ng-controller="qAppCntrl"> 
<div class="list" ng-repeat="question in questions.data.Question track by $index" > 
    <div class="item item-divider"> 
    {{question.text}} 
    </div> 
    <label class="item item-input" ng-if="question.type =='comment'"> 
    <textarea placeholder="Comments" ng-model="question.answer"></textarea> 
    </label> 
</div> 
<button ng-click="submit()">Post</button> 
</div>

来源

2014-06-06 12:04:27 Satish

textArea在angular js中的双向绑定

回答

相关问题