网页需要花费大量时间来加载

时间:2016-12-20 09:54:49

标签: javascript angularjs

我正在使用AngularJS构建应用程序,这里我正在解析文件中的json数据,但是应用程序需要花费大量时间来加载,我不确定我是否做错了...

这是我的代码

app.js

var plusminusApp = angular.module('plusminusApp', ['ngRoute']);
plusminusApp.config(function($routeProvider) {
    $routeProvider

        .when('/', {
            templateUrl : 'index.html'
        })

        .when('/home', {
            templateUrl : 'lib/pages/home.html'
        })

        .when('/overview', {
            templateUrl : 'lib/pages/overview.html'
        })

        .when('/loans', {
            templateUrl : 'lib/pages/loans.html'
        })
});

function PostsCtrlAjax($scope, $http)
    {
    $http({method: 'POST', url: 'resource.json'}).success(function(data)
    {
    $scope.categories = data; 
    });
}


function landingPageDetails($scope, $http)
    {
    $http({method: 'POST', url: 'today.json'}).success(function(data)
    {
    $scope.today_data = data; 
    });
}


function loansList($scope, $http)
    {
    $http({method: 'POST', url: 'loans.json'}).success(function(data)
    {
    $scope.myLoans = data; 
    });
}

overview.html

<div class="page-view">
    <br>
    <div class="filter-box">
        <select class="filter">
            <option>This month</option>
            <option>This Week</option>
            <option>Last Week</option>
            <option>Last Month</option>
            <option>This Year</option>
        </select>
        <img class="select-under-line" src="lib/images/underline.png">
    </div>

    <div class="plus-minus-tabs">
        <button class="button-outline">+</button>
        <button class="button-outline">-</button>
    </div>
        <div class="tab-results">       
            <div id="ng-app" ng-app ng-controller="PostsCtrlAjax">
            <div ng-repeat="category in categories">
                <div class="post-list">
                    <div class="category-icon">
                        <img ng-src="{{category.picture}}"/>
                    </div>
                    <div class="category-balance-details">
                        <p class="balance-text">Balance:{{category.balance}}</p>
                        <span class="status earning-progress"></span>
                        <span class="status spending-progress"></span>
                    </div>
                </div>
            </div>
            </div>
        </div>    
<br><br>

0 个答案:

没有答案