angularjs定製指令值不張貼到控制器

Question

我在angularjs是新， 我使用，我已經來到這裏 Fiddle 這個指令不張貼價格值驗證後的控制器，我得到的唯一名字自定義指令字段值。

這是我的代碼：

<div class="form-group"> 
<label for="exampleInputEmail1">Item Price</label>     
<div class="input-group"> 
<span class="input-group-addon">$</span> 
<input id="phone" class="form-control" ng-model="item.price" currency-input> 
</div> 
</div> 

這裏是控制器代碼：

angular.module('ngApp') 
.controller('ItemCtrl',function($scope){ 

$scope.item = {}; 

$scope.addItem = function(){  
    console.log($scope.item); 
} 
}) 
.directive('currencyInput', function(){ 
return ...... 
}; 

}）;

Answer 1

我看到您正在使用link函數來註冊您的自定義分析器。

請注意，這種方法更適合於將我們自定義的parsers註冊到NgModelController，因爲沒有直接的API可以從指令外部執行此操作。

我建議進行以下更改以使其正常工作。

1. angular.module('minovateApp',[]) - 您需要傳遞一個空數組，指示該模塊沒有依賴關係。
2. 您無法捕捉模型中的值的原因是因爲您是自定義解析器中的not returning the parsed value，因此請修改您的link函數，如下所示。

裏面你貨幣輸入指令，

link: function(scope, element, attrs, ctrl) { 
     /* removed the return as it's not required */ 
     ctrl.$parsers.push(function(inputValue) { 
      var inputVal = element.val(); 

      /* removing your logic for brevity */ 
      var res = intPart + decPart; 

      if (res != inputValue) { 
       ctrl.$setViewValue(res); 
       ctrl.$commitViewValue(); 
       ctrl.$render(); 
      } 

      /* return the final value once you're done parsing */ 
      return res; 
    }); 

下面是一個示例Pen與上述變化。希望這會有所幫助:)