AngularJS textarea不更新

我有此指令可以防止textarea的字符。AngularJS textarea不更新

restrict: 'E', 
    scope:{ 
     contacts : "=" 
    }, 
    template:'<textarea ng-model="contacts" ng-list=","><textarea>', 
    link: function(scope, element, attr, ngModel){ 
     scope.$watch('contacts', function(newValue, oldValue){ 
      var cut = newValue; 
      if(newValue.length>0) 
       var cut = newValue[newValue.length-1].replace(/\n|a|b|c/g, ""); 
      scope.contacts[scope.contacts.length-1] = cut; 
     }); 
    } 


<email-textarea contacts="contacts"></email-textarea>

看到這個fiddle

如果我開始打字，在範圍內接觸忽略我設置的字符。但textarea似乎不更新其文本。我如何更新textarea？

來源

2014-12-19 marcel

@ raina77ow：你是對的，這可能是一個問題，因爲你不能添加一個對象到textarea。 – marcel 2014-12-19 10:48:36

的問題是，ng-list不看在收集」的內容（出於某種原因，人們似乎沒有這樣做，這不會更改源的方式）。所以一種可能的方法是在你自己的代碼中監視它：

scope.$watchCollection('contacts', function(newContacts){ 
    if (newContacts) { 
    scope.contacts = newContacts.map(function(rec){ 
     return rec.replace(/[\nabc]/g, ''); 
    }); 
    } 
});

Demo。我在這裏使用的是watchCollection，因爲只有在內容的contacts數組已更改 - 每次處理程序觸發時都會交換該數組。

另一種方法是仍然使用watch，但僅改變它是否已經因爲無效字符的被改變的陣列：

scope.$watch('contacts', function (newContacts) { 
    var fixedContacts, shouldBeReplaced; 
    if (newContacts) { 
     fixedContacts = newContacts.map(function(rec) { 
      var newRec = rec.replace(/[\nabc]/g, ''); 
      if (newRec !== rec) { 
       shouldBeReplaced = true; 
      } 
      return newRec; 
     }); 
     if (shouldBeReplaced) { 
      scope.contacts = fixedContacts; 
     } 
    } 
});

Demo。

請注意，在這兩種情況下，您都必須監視整個列表：您不能保證用戶不會回到列表的開頭並開始在那裏（或在文本的任何部分）進行更改。這就是爲什麼只檢查最後一個元素不夠好的原因。

來源

2014-12-19 11:04:25 raina77ow

謝謝，我只是看了最後一個測試元素。看清單很棒，以前不知道這個功能:) – marcel 2014-12-19 11:30:59

AngularJS textarea不更新

回答

相關問題