使用Knockout填充列表

时间:2016-04-07 11:26:08

标签: angularjs knockout.js

我是新角色和淘汰赛。但我已设法使用knockout创建一个分页列表。但我希望动态过滤列表,而用户在使用角度输入框中输入是否可行?
这是我的淘汰脚本,我创建了分页。

<script>
function formattedPrice(amount) {
    var price = amount.toFixed(2)
    return price;
}

function StatementViewModel() {
    var self = this;

    self.transactions = @Html.Raw(JsonConvert.SerializeObject(Model, new JsonSerializerSettings { ReferenceLoopHandling= ReferenceLoopHandling.Ignore })); 
    self.pageSize = 8;
    self.currentPage = ko.observable(1);
    self.lastPage = Math.ceil(self.transactions.length / self.pageSize);
    self.currentTransactions = ko.computed(function () {
        var startIndex = (self.currentPage() - 1) * self.pageSize;
        var endIndex = startIndex + self.pageSize;
        return self.transactions.slice(startIndex, endIndex);
    });

    self.nextPage = function () {
        self.currentPage(self.currentPage() + 1);
    };
    self.previousPage = function () {
        self.currentPage(self.currentPage() - 1);
    };
};
ko.applyBindings(new StatementViewModel());


下面的脚本是一个角度脚本,可在用户键入时过滤列表。但我如何连接这两个?我有可能吗?

<script>
angular.module('myApp', []).controller('namesCtrl', function($scope) {
    $scope.names = [
        'Jani',
        'Carl',
        'Margareth',
        'Hege',
        'Joe',
        'Gustav',
        'Birgit',
        'Mary',
        'Kai'
    ];
});

1 个答案:

答案 0 :(得分:2)

同时使用角度和淘汰是没有意义的。 Angular提供开箱即用的双向绑定,所以只需使用它而不是淘汰赛。