Angularjs：在使用ControllerAs時過濾ng重複使用

Question

This post最初提出問題，並且包含一個受歡迎的答案，但我無法找到更新代碼以與ControllerAs一起使用的方式。

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

 
app.filter('slice', function() { 
 
    return function(arr, start, end) { 
 
    return arr.slice(start, end); 
 
    }; 
 
}); 
 

 
app.controller('MainController', function() { 
 
    vm = this; 
 
    vm.items = []; 
 
    vm.start = 0; 
 
    vm.end = 20; 
 
    for (var i = 0; i < 100; i++) vm.items.push(i); 
 
    return vm; 
 
});

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

 
<div ng-app="myApp"> 
 
    <div ng-controller='MainController as main'> 
 
    Start: <input ng-model="main.start"> End: <input ng-model="main.end"> 
 
    <ul> 
 
     <li ng-repeat="item in items | slice:main.start:main.end">{{item}}</li> 
 
    </ul> 
 
    </div> 
 
</div>

Answer 1

結帳這個plnkr

當你與controllerAs工作語法，你需要使用控制器指針來訪問其屬性和方法。

<div ng-app="myApp"> 
    <div ng-controller='MainController as main'> 
    Start: <input ng-model="main.start"> End: <input ng-model="main.end"> 
    <ul> 
     <li ng-repeat="item in main.items | slice:main.start:main.end">{{item}}</li> 
    </ul> 
    </div> 
</div> 
</body>