Question

我似乎无法使用AngularJS和localstorage为我的项目使用过滤器。没有错误但是当我在输入字段中输入单词时，没有任何反应。有人愿意帮帮我吗？：）

HTML：

<div ng-app="myApp" ng-controller="ViewSummaryCtrl">
        <input type="text" ng-model="query">
</div>        
<div class="flex-container" ng-repeat="expense in expenses | filter: {$:query}">
    <div style="flex-grow: 2" class="date-col">{{expense.date}} </div>
    <div style="flex-grow: 2" class="category-col">{{expense.category}} </div>
    <div style="flex-grow: 3" class="description-col"> {{expense.description}}</div>
    <div style="flex-grow: 2" class="amount-col">{{expense.amount| currency: "kr"}} </div>
    <div style="flex-grow: 1" class="button-col">
        <button class="button" type="button" ng-click="edit()">Edit</a>

controller.js

.controller('ViewSummaryCtrl', ['$scope', 'expService', 'categoryList',
    function ($scope, expService, categoryList) {           
        $scope.expenses = expService.getExpense();

Services.js

//this function shows the expenses stored in localStorage
        getExpense: function () {
            expenses = [];
            var prefixLength = prefix.length;
            Object.keys(localStorage)
                .forEach(function (key) {                        
                    if (key.substring(0, prefixLength) == prefix) {
                        //iterate through each item in localStorage and match it to the prefix key
                        var item = window.localStorage[key];
                        //convert stringified data back into JSON format
                        item = JSON.parse(item);
                        item.key = key;
                        expenses.push(item);
                    }
                });
            console.log(expenses);
            return expenses;
        },

Answer 1

$scope.expenses在ViewSummaryCtrl中工作，但div.flex-container不是div [ng-app]的子节点。所以没有expenses。

使用angularJS过滤localstorage中的数据

1 个答案: