AngularJS : 지침 내에서 통화 필터를 어떻게 사용합니까?

이 plunker에서 편집중인 디스플레이에 통화 필터를 적용하려고합니다. 이 필터는 활성화되어있을 때 입력을 표시하지만 활성화되지 않은 경우 필터를 적용하려고하는 place in edit 지시문입니다.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} 
    ]; 


});

보기 :

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

가 여기 modified plunkr입니다 :

<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

' {{값 | 통화}}'? –

그걸 위해 시계를 써야 할 것 같아요. –

당신은 필터 당신이 다른 템플릿을 사용하는 것과 같은 방법을 사용합니다.

출처

2014-10-31 21:43:57

AngularJS : 지침 내에서 통화 필터를 어떻게 사용합니까?

답변

관련 문제