雙向數據綁定失敗ng-model

Question

我的雙向數據綁定使用ng-model不起作用。

• AngularJS Docs
• Relevant Question

家長指令模板：

<div class="form-group"> 
    <label>Company Phone</label> 
    <input ng-model="formData.company_phone" type="phonenumber" class="form-control" placeholder="Company Phone"> 
</div> 

那孩子指令：

.directive('input', [function(){ 
    return: { 
     restrict: 'E', 
     require: '?ngModel',//right now this is binding to this directive scope, not a parent one 
     link: function($scope, element, attr, ngModel){ 
      if (attr.type !== 'phonenumber') { 
       return; 
      } 
     //some code to validate a phone number 
     $scope.$apply(function() { 
      //bind updated number, but I need this to reflect in the parent scope 
      $scope[attr.ngModel] = formattedNumber; 
} 

Answer 1

我用$parse來解決這個問題：

.directive('input', ['$parse', function($parse){ 
    return { 
     restrict: 'E', 
     require: '?ngModel', 
     link: function(scope, element, attr, ngModel){ 
      var getter = $parse(attr.ngModel); 
      var setter = getter.assign; 

      if (attr.type !== 'phonenumber') { 
       return; 
      } 
      //code that validated a phone number 

      scope.$apply(function() { 
       setter(scope, formattedNumber); 
      }); 
     } 
    } 
}]);