ล่าสุดการพัฒนาเว็บบทเรียน
 

AngularJS limitTo กรอง


ตัวอย่าง

แสดงเฉพาะสามรายการแรกของอาร์เรย์:

<div ng-app="myApp" ng-controller="sizeCtrl">

<ul>
<li ng-repeat="x in cars | limitTo : 3">{{x}}</li>
</ul>

</div>

<script>
var app = angular.module('myApp', []);
app.controller('sizeCtrl', function($scope) {
    $scope.cars = ["Audi", "BMW", "Dodge", "Fiat", "Ford", "Volvo"];
});
</script>
ลองตัวเอง»

ความหมายและการใช้งาน

limitTo กรองส่งกลับอาร์เรย์หรือสตริงที่มีเพียงจำนวนที่ระบุขององค์ประกอบ

เมื่อ limitTo กรองจะใช้สำหรับอาร์เรย์ก็จะส่งกลับอาร์เรย์ที่มีเพียงจำนวนที่ระบุในรายการ

เมื่อ limitTo กรองจะใช้สำหรับสายก็จะส่งกลับสตริงที่มีเพียงจำนวนที่ระบุของตัวละคร

เมื่อ limitTo กรองใช้สำหรับตัวเลขก็จะส่งกลับสตริงที่มีเพียงการระบุจำนวนตัวเลข

ใช้ตัวเลขที่ติดลบจะกลับองค์ประกอบเริ่มต้นจากจุดสิ้นสุดขององค์ประกอบแทนการเริ่มต้น


วากยสัมพันธ์

{{ object | limitTo : limit : begin }}

ค่าพารามิเตอร์

Value Description
limit  A number, specifying how many elements to return
begin Optional. A number specifying where to begin the limitation. Default is 0

ตัวอย่างเพิ่มเติม

ตัวอย่าง

แสดงที่ผ่านมาสามรายการของอาร์เรย์:

<div ng-app="myApp" ng-controller="sizeCtrl">

<ul>
<li ng-repeat="x in cars | limitTo : -3">{{x}}</li>
</ul>

</div>

<script>
var app = angular.module('myApp', []);
app.controller('sizeCtrl', function($scope) {
    $scope.cars = ["Audi", "BMW", "Dodge", "Fiat", "Ford", "Volvo"];
});
</script>
ลองตัวเอง»

ตัวอย่าง

แสดงสามรายการเริ่มต้นที่ตำแหน่งที่ 1:

<div ng-app="myApp" ng-controller="sizeCtrl">

<ul>
<li ng-repeat="x in cars | limitTo : 3 : 1">{{x}}</li>
</ul>

</div>

<script>
var app = angular.module('myApp', []);
app.controller('sizeCtrl', function($scope) {
    $scope.cars = ["Audi", "BMW", "Dodge", "Fiat", "Ford", "Volvo"];
});
</script>
ลองตัวเอง»

ตัวอย่าง

แสดงอักขระสามตัวแรกของสตริง:

<div ng-app="myApp" ng-controller="sizeCtrl">

<h1>{{txt | limitTo : 3}}</h1>

</div>

<script>
var app = angular.module('myApp', []);
app.controller('sizeCtrl', function($scope) {
    $scope.txt = "Hello, welcome to AngularJS";
});
</script>
ลองตัวเอง»

ตัวอย่าง

แสดงตัวเลขสามตัวแรกและจำนวน:

<div ng-app="myApp" ng-controller="sizeCtrl">

<h1>{{phone | limitTo : 3}}</h1>

</div>

<script>
var app = angular.module('myApp', []);
app.controller('sizeCtrl', function($scope) {
$scope.phone = "123456789";
});
</script>
ลองตัวเอง»

หน้าเว็บที่เกี่ยวข้อง

AngularJS Tutorial: กรองเชิงมุม