angular.js不可知的过滤器 [英] angular.js agnostic filter

问题描述

我在Angular.js新的，我读我的第一本书，认为停止和实验我所学会为止。我尝试创建一个 limitTo 过滤器，但数量会由用户插入。

 ＆LT;脚本＆GT;
            VAR每月= 123.659855，89.645222，97.235644，129.555555]
            功能MyFilterDemoCtrl（$范围）{$ scope.monthly =月;};
        ＆LT; / SCRIPT＆GT; 民：其中，输入NG模型=数类型=文本/＆GT;         ＆LT;李NG控制器=MyFilterDemoCtrlNG重复=千兆字节每月| limitTo：{{NUM}}＆GT; {{千兆字节|数量：2}}＆LT; /李＆GT;
 

所以，当我键入 3 在民只有前三个号码印在里。但我什么也没得到。我在想什么，什么是执行这种任务的正确方法？我应该code像 limitTo：{{NUM}} 或 limitTo：NUM

在此先感谢

解决方案

两件事情：

1. 您需要有 NG-模式=NUM在控制器的范围。只需移动 NG-控制器其声明修复超出这个。


2. 这应该是 limitTo：NUM ，而不是 limitTo：{{NUM}} 。你是不是插值num的值转换成字符串。

\r

\r

VAR每月= 123.659855，89.645222，97.235644，129.555555]\r
\r
功能MyFilterDemoCtrl（$范围）{\r
  $ scope.monthly =月;\r
}\r
\r
angular.module（'应用'，[]）\r
  .controller（'MyFilterDemoCtrl'，MyFilterDemoCtrl）;

\r

＆LT;脚本SRC =htt​​ps://ajax.googleapis.com/ajax /libs/angularjs/1.2.23/angular.min.js\"></script>\r
\r
＆LT; D​​IV NG-应用=应用程序NG控制器=MyFilterDemoCtrl＆GT;\r
  \r
  民：其中，输入NG模型=数类型=文本/＆GT;\r
\r
  ＆LT;李NG重复=每月千兆字节| limitTo：NUM＆GT;\r
      {{千兆字节|数：2}}\r
  ＆LT; /李＆GT;\r
         \r
＆LT; / DIV＆GT;

\r

\r

\r

I am new in Angular.js, I am reading my first book and thought to stop and experiment with what I've learned so far. I try to create a limitTo filter , but the number will be inserted by the user.

        <script>
            var monthly=[123.659855, 89.645222, 97.235644, 129.555555]
            function MyFilterDemoCtrl($scope) {$scope.monthly= monthly;};
        </script>

 Num: <input ng-model="num" type="text" />

         <li ng-controller="MyFilterDemoCtrl" ng-repeat="gigabytes in monthly | limitTo:{{num}}"> {{ gigabytes | number:2}} </li>

So when I type 3 in the Num only the first three numbers are printed in the li. But I get nothing. What am I missing and what is the proper way to implement such task? Should I code like limitTo:{{num}} or limitTo:num

Thanks in advance

解决方案

Two things:

1. You need to have the ng-model="num" in the controller's scope. Simply moving the ng-controller outside its declaration fixes this.
2. It should be limitTo: num rather than limitTo: {{num}}. You are not interpolating the value of num into a string.

var monthly = [123.659855, 89.645222, 97.235644, 129.555555];

function MyFilterDemoCtrl($scope) {
  $scope.monthly = monthly;
}

angular.module('app', [])
  .controller('MyFilterDemoCtrl', MyFilterDemoCtrl);

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>

<div ng-app="app" ng-controller="MyFilterDemoCtrl">  
  
  Num: <input ng-model="num" type="text" />

  <li ng-repeat="gigabytes in monthly | limitTo: num"> 
      {{ gigabytes | number:2}} 
  </li>
         
</div>         

这篇关于angular.js不可知的过滤器的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！