吴模型不更新视图

Question

我已经彻底搜索，无法找到我的问题的解决方案。 我正在尝试填写一个表单来创建新的任务对象到网站上的项目上，比如Scrum积压或者Angular和angular-ui中的某个项目。

我将Angular-UI用于typehead功能，用于将团队成员添加到任务中，以便项目上的可用成员弹出。我见过有类似问题的人，但似乎没有任何解决方案能帮助我。下面是HTML和控制器。对不起，长标记，但我怀疑它必须做一些嵌套的控制器和混合示波器，所以我包括所有相关的东西。

<div ng-controller="SubmitCreateTaskController"> 
<div class="modal fade" id="taskModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true"> 
    <div class="modal-dialog"> 
     <div class="modal-content"> 
      <div class="modal-header"> 
       <button type="button" class="close" data-dismiss="modal"> 
        <span aria-hidden="true">&times;</span> 
        <span class="sr-only">Close</span> 
       </button> 
       <h4 class="modal-title" id="myModalLabel">New Task</h4> 
      </div> 
      <div class="modal-body">   
       <form role="form" method="post" name="create-task"> 
        <div class="form-group"> 
         <label for="taskname">Task Name</label> 
         <input type="text" class="form-control" id="taskname" ng-model="taskForm.taskName" placeholder="Task Name"> 
        </div> 

        <div class="form-group"> 
         <label for="taskdesc">Description</label> 
         <textarea class="form-control" id="taskdesc" size="3" ng-model="taskForm.taskDescription" placeholder="Enter a short description here..." rows="2"></textarea> 
        </div> 

        <div class="form-group"> 
         <label for="assigneddate">Assigned Date</label> 
         <input type="text" class="form-control" id="assigneddate" ng-model="taskForm.assignedDate"> 
        </div> 

    <div ng-controller="TypeAheadController"> 
         <div class="form-group"> 
          <label for="contributors">Add Contributors</label> 
          <input id="contributors" type="text" class="form-control" ng-model="contrib.selected" typeahead="member for member in contrib.stream_members | filter:$viewValue" 
          typeahead-editable="false" typeahead-on-select="contrib.onSelect($item)"> 
         </div> 

         <div class="form-group"> 
          <label for="users">Contributors:</label> 

          <textarea class="form-control" disabled="disabled" id="users" ng-model="contrib.entered" rows="1"></textarea> 

         </div> 
        </div> 

    <div class="form-group"> 
         <label for="taskcomments">Comments</label> 
         <textarea class="form-control" id="taskcomments" ng-model="taskForm.comment" placeholder="Comments" rows="2"></textarea> 
        </div> 

        <div class="modal-footer"> 

         <button type="submit" class="btn btn-primary" ng-click="taskForm.submit()">Add Task</button> 
         <button type="button" class="btn btn-danger" data-dismiss="modal">Cancel</button> 
        </div> 

       </form>  
      </div> 
     </div> 
    </div> 
</div> 

控制器：

.controller('SubmitCreateTaskController', ['$scope', '$http', function($scope, $http) { 
$scope.taskForm = {}; 
$scope.taskForm.taskName = ''; 
$scope.taskForm.taskDescription = ''; 
$scope.taskForm.assignedDate = new Date(); 
$scope.taskForm.contributors = []; 
$scope.taskForm.comment = ''; 

$scope.taskForm.submit = function(item, event) { 
    var formData = {name: $scope.taskForm.taskName, 
        description: $scope.taskForm.taskDescription, 
        status: 'open', 
        assigned: $scope.taskForm.assignedDate, 
        completed: null, 
        contributors: $scope.taskForm.contributors, 
        comments: [{body: $scope.taskForm.comment, 
           user: 'RACHE User', 
           date: new Date() 
           }] 
        }; 

    var postURL = '../create_task/' + $scope.stream_name; 

    $http.post(postURL, formData) 
    .success(function(){ 
     taskForm = {}; // empty the form of previous input values 
     alert('New Task Created for ' + $scope.stream_name); 
    }) 
    .error(function(res) { 
     alert(res.data); 
    }); 
}; 
}]) 
.controller('TypeAheadController', ['$scope', '$http', function($scope, $http) { 
$scope.contrib = {}; 
$scope.contrib.selected = ''; 
$scope.contrib.stream_members = undefined; 
$scope.contrib.entered = []; 

$http.get('/stream_members/' + $scope.stream_name) 
.then(function(res) { 
    $scope.contrib.stream_members = res.data.stream_members; 
}); 

$scope.contrib.onSelect = function($item) { 

    $scope.contrib.selected = ''; 

    $scope.contrib.entered.push($item); 
    console.log($scope.contrib.entered); 
}; 

这最后一位是'TypeAheadController'中的重要组成部分。我正在尝试将加强型团队成员添加到稍后将发送给数据库的textarea下。这就是为什么我将实际的typeahead输入框绑定到“contrib.select”并将“display/post”框限制为“contrib.entered”，因此可以在添加一个成员后继续搜索，搜索框被清除，选中成员被添加到下面的框中，新的搜索可以开始。在标记中，我调用typeahead-on-select回调函数中的最后一个（onSelect）函数。这样我就可以清除输入框，并且可以轻松添加另一个成员，而无需手动删除。在这个函数中，输入的成员应该附加到绑定在“display/post”框下面的数组中。发生这种情况，由于控制台日志显示良好的值，搜索/输入字段被清除，所以函数也被调用。

但是，视图不会更新绑定到显示框的更新数组。我尝试了一切。我搜索了一下，发现它在这里需要使用点符号，因为Angular不能用原语更新，但这也没有帮助。

一切工作正常，逻辑良好，价值是好的，当我打印出来，弹出工程和清除预期，但该死的textarea下不会更新。

有什么建议吗？近一天来，我一直坚持这一点，我对此感到非常沮丧。任何帮助我都会非常棒！ 先谢谢你们！

Answer 1

Textareas不使用ng值，因为它们的值包含在标记中。删除ng模型并将标记之间的值。

<textarea class="form-control" disabled="disabled" id="users" rows="1">{{contrib.entered}}</textarea>