Question

我正在学习角度的基础知识，今天它开始使用工厂更改我的应用程序以获取数据并实现路由提供程序！到目前为止一切正常！但是当我尝试在另一个视图上添加数据并返回到我的列表视图范围时，将再次从工厂重新加载，并且不会显示任何添加的数据。

我的方法不起作用，因为每次改变我的视图我都会调用我的控制器从工厂重新加载数据！如何使我的添加模板工作并在其他任何地方更改数据。

也许有人可以给我一个提示如何应对这个问题？

的script.js

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

app.factory('tripFactory', function($http) {
 return{
    getTrips : function() {
        return $http({
            url: 'trips.json',
            method: 'GET'
            })
        }
    }

});

app.controller('TripController', function($scope, $filter, tripFactory) {
    $scope.trips = [];

    tripFactory.getTrips().success(function(data){
    $scope.trips=data;

    var orderBy = $filter('orderBy');

    $scope.order = function(predicate, reverse) {
        $scope.trips = orderBy($scope.trips, predicate, reverse)};

    $scope.addTrip = function(){
        $scope.trips.push({'Startdate':$scope.newdate, DAYS: [{"DATE":$scope.newdate,"IATA":$scope.newiata,"DUTY":$scope.newduty}]})
        $scope.order('Startdate',false)
        $scope.newdate = ''
        $scope.newiata = ''
        $scope.newduty = ''
        }

   $scope.deleteTrip = function(index){   
        $scope.trips.splice(index, 1);
        }

    });
});

view.js

app.config(function ($routeProvider){
  $routeProvider
    .when('/',
          {
              controller: 'TripController',
              templateUrl: 'view1.html'
          })
    .when('/view1',
          {
              controller: 'TripController',
              templateUrl: 'view1.html'
          })
    .when('/view2',
          {
              controller: 'TripController',
              templateUrl: 'view2.html'
          })
    .when('/addtrip',
          {
              controller: 'TripController',
              templateUrl: 'add_trip.html'
          })
    .otherwise({ redirectTo: 'View1.html'});
});

这是我的plunker

感谢您的帮助

Answer 1

您应该使用Service而不是Factory。每次调用服务时都会加载服务。工厂刚加载一次。

app.service('tripFactory', function($http) {
return{
    getTrips : function() {
        return $http({
                url: 'trips.json',
                method: 'GET'
            })
        }
    }
});

AngularJS - 使用路由将数据保存到$ scope？

1 个答案: