AngularJS：您如何在指令中使用貨幣過濾器？

在這plunker，我試圖將貨幣過濾器應用到未被編輯的顯示。這是一個就地編輯指令，當它處於活動狀態時顯示輸入，但我希望在未激活時應用該過濾器。AngularJS：您如何在指令中使用貨幣過濾器？

腳本：

var app = angular.module('plunker', []); 

app.directive('editInPlace', function() { 
    return { 
     restrict: 'E', 
     scope: { 
      value: '=' 
     }, 
     template: '<span ng-click="edit()" ng-bind="value" ng-show="!editing"></span><input ng-model="value" ng-blur="onBlur()" ng-show="editing"></input>', 
     link: function ($scope, element, attrs) { 
      var inputElement = element.find('input'); 

      // reference the input element 
      element.addClass('edit-in-place'); 

      // Initially, we're not editing. 
      $scope.editing = false; 

      // ng-click handler to activate edit-in-place 
      $scope.edit = function() { 
       $scope.editing = true; 

       // element not visible until digest complete 
       // timeout causes this to run after digest 
       setTimeout(function() { 
       inputElement[0].focus(); 
       }); 
      }; 

      $scope.onBlur = function() { 
       $scope.editing = false; 
      }; 
     } 
    }; 
}); 

app.controller('MainCtrl', function($scope) { 
    $scope.contacts = [ 
    {name: 'Katniss', total: 35645.58}, 
    {name: 'Peeta', total: 25178.21} 
    ]; 


});

觀點：

<body ng-controller="MainCtrl"> 
    <ul style="margin-top:20px;"> 
     <li ng-repeat="contact in contacts"> 
     {{contact.name}} -- 
      <edit-in-place value="contact.total"></edit-in-place> 
     </li> 
    </ul> 
    <hr/> 
    <pre>{{contacts}}</pre> 
    <hr/> 
    </body>

來源

2014-10-31 jgravois

' {{value |貨幣}}'？ – 2014-10-31 21:38:32

我認爲你必須爲此寫一個手錶。 – 2014-10-31 21:38:37

您使用的過濾器，你會用它在任何其他模板以同樣的方式：

template: '<span ng-click="edit()" ng-show="!editing">{{ value | currency}}</span><input ng-model="value" ng-blur="onBlur()" ng-show="editing"></input>'

這是你的modified plunkr。

來源

2014-10-31 21:43:57

AngularJS：您如何在指令中使用貨幣過濾器？

回答

相關問題