2017-11-03 49 views
0

我正在實現一個過濾器標記大小,它可以爲分隔符提供可選參數。使用過濾器方法給出可選參數angular

默認情況下,過濾器會生成給定輸入的單個字符的逗號分隔字符串。如果提供分隔符,則輸入字符串中的各個字符由指定的分隔符分隔。

沒有令牌提供了:(記號化處理用逗號):在

{{"hello world"|tokenize}} 

結果:

h,e,l,l,o,,w,o,r,l,d 

令牌所提供:

{{"hello world"|tokenize:'#'}} 

結果:

h#e#l#l#o##w#o#r#l#d. 

問題是我無法傳遞可選參數並接收它以可選分隔符爲基礎分隔字符串。

代碼的html:

<!doctype html> 
<html ng-app="myApp"> 
    <head> 
     <script src="angular.js"></script> 
     <script src="filter.js"></script> 
    </head> 
    <body> 
     <div ng-controller='HelloController'> 
     <label>Input</label><input ng-model='greeting'><br><br> 
     <label>Delimeter</label><input ng-model='delimeter'><br> 
     <p>{{greeting | tokenize}}(default)</p> 
     <p>{{greeting| tokenize:arg1}}(with Option)</p> 
     </div> 
    </body> 
</html> 

和我filter.js代碼:

angular.module('myApp', []) 
    .controller('HelloController', function($scope) { 
     $scope.greeting = "Angular is Awesome"; 
     //$scope.delimeter="#"; 
    }) 
    .filter('tokenize', function() { 
     return function(value) { 
      if (angular.isString(value)) { 
       var abc = []; 
       abc = value.split(''); 
       value = abc.join(); 
       return value; 
      } else { 
       return value; 
      } 
     };  
    }); 
+0

看@emed一個向下走。 「在你的過濾函數中聲明另一個參數」。之後,分割可選參數或「'。 – o4ohel

+0

好的,如果我必須返回兩個值與默認分隔符和其他與可選參數一起。如何做到這一點。 – Rahila

+0

就像我必須給出兩個輸出:h,e,l,l,o,w,o,r,l,d(默認),另一個輸出h#e#l#l#o ## w#o #R·L#d。 – Rahila

回答

0

只是聲明另一個參數的過濾功能:

<p>{{"Angular is Awesome" | tokenize:'arg1'}}(with Option)</p> 
            ^Dont forget quotes if it isn't a variable 


.filter('tokenize', function() { 
    return function (value, optionalArg) { 
     console.log(value); // Angular is Awesome 
     console.log(optionalArg); // arg1 

     if (angular.isString(value)) { 
      var abc = []; 
      abc = value.split(''); 
      value = abc.join(optionalArg); //pass the separator to join 
      return value; 
     } else { 
      return value; 
     } 

https://docs.angularjs.org/guide/filter

+0

A,n,g,u,l,a,r,i,s,A,w,e,s,o,m,e(默認) A,n,g,u,l,a ,r,,i,s,,A,w,e,s,o,m,e(帶Option)是我得到的回報。我如何通過應用arg1來返回選項。所以它意味着如何從函數返回兩個不同的值到




{{greeting | tokenize}}(default)

{{greeting| tokenize:'arg1'}}(with Option)

Rahila

+0

@Rahila將分隔符傳遞給連接函數,編輯後顯示該部分 – emed