Javascript 同步与服务链接的两个AngularJS控制器

我有两个应该同步的angularJS控制器。 第一个是列表上的过滤器，第二个显示列表。两个控制器都有一个服务用户，可以进行一些类似ajax的异步调用

我的问题是，过滤器在列表初始化之前进行过滤，因此当页面第一次加载时，我有未过滤的结果。如何解决

这是我的

代码如下：

var myApp=angular.module（'myApp'，[]）；
控制器（“infoCtrl”，函数（$scope，$timeout，person）{
person.get（）.then（函数（响应）{
//超时以防止“$digest已在进行”错误
$timeout（函数（）{
$scope.people=响应；
$scope.$apply（）；
})
});
});
myApp.controller（“filterCtrl”，函数（$scope，person）{
$scope.$watch（“maxAge”，函数（newValue）{
如果（新值）{
person.filterPeople（newValue）；
}
});
});
myApp.service（“person”，函数（$q，$timeout）{
var _me=这个；
var AjaxGetPeople=函数（）{
返回$timeout（函数（）{
var somedata=[{name:'Marcel Sapin'，年龄：26}，
{姓名：'Anhel De Niro'，年龄：42}，
{姓名：'Johny reset'，年龄：30}]；
_me.people=somedata；
返回一些数据；
});
};
var filterPeople=函数（最大值，集合）{
如果（！collection）collection=\u me.people；
如果（！收款）返回；
角度.forEach（集合，函数（p）{
p、 visible=（p.age好吧，尝试如下初始化：

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

myApp.controller("infoCtrl", function ($scope, $timeout, person) {
    person.get(30).then(function (response) {
        // timeout to prevent '$digest already in progress' error
        $timeout(function () {
            $scope.people = response;
            $scope.$apply();
        })
    });
});

myApp.controller("filterCtrl", function ($scope, person) {
    $scope.$watch("maxAge", function (newValue) {
        if (newValue) {
            person.filterPeople(newValue);
        }
    });
});

myApp.service("person", function ($q, $timeout) {
    var _me = this;
    var AjaxGetPeople = function () {
        return $timeout(function () {
            var somedata = [{name: 'Marcel Sapin',age: 26}, 
                            {name: 'Anhel De Niro',age: 42}, 
                            {name: 'Johny Resset',age: 30}];
            _me.people = somedata;
            return somedata;
        });
    };
    var filterPeople = function (maxAge, collection) {
        if (!collection) collection = _me.people;
        if (!collection) return;
        angular.forEach(collection, function (p) {
            p.visible = (p.age <= maxAge);
        });
    };
    var get = function (init) {
        if (_me.people) { // return from 'cache'
            return $q.resolve(_me.people);
        }
        // if not 'cached', call 'ajax'
        return AjaxGetPeople().then(function (response) {
            // add visible property to people
            filterPeople(init, response);
            _me.people = response;
            return response;
        });
    };

    return {
        'get': get,
            'filterPeople': filterPeople
    };
});

var myApp=angular.module（'myApp'，[]）；
控制器（“infoCtrl”，函数（$scope，$timeout，person）{
person.get（30）.然后（函数（响应）{
//超时以防止“$digest已在进行”错误
$timeout（函数（）{
$scope.people=响应；
$scope.$apply（）；
})
});
});
myApp.controller（“filterCtrl”，函数（$scope，person）{
$scope.$watch（“maxAge”，函数（newValue）{
如果（新值）{
person.filterPeople（newValue）；
}
});
});
myApp.service（“person”，函数（$q，$timeout）{
var _me=这个；
var AjaxGetPeople=函数（）{
返回$timeout（函数（）{
var somedata=[{name:'Marcel Sapin'，年龄：26}，
{姓名：'Anhel De Niro'，年龄：42}，
{姓名：'Johny reset'，年龄：30}]；
_me.people=somedata；
返回一些数据；
});
};
var filterPeople=函数（最大值，集合）{
如果（！collection）collection=\u me.people；
如果（！收款）返回；
角度.forEach（集合，函数（p）{
p、 可见=（p.age以下过滤器（ageFilter）将根据maxAge变量进行过滤

HTML

<div ng-app='myApp' ng-controller="Main" ng-init="maxAge=30">
    <input type="text" ng-model="maxAge">
    <li ng-repeat="user in users | ageFilter:maxAge">{{user.name}}</li>
   </div>


{{{user.name}

脚本

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

myApp.filter('ageFilter', function() {
  return function(input, Maxage) {
    var out = [];
      for (var i = 0; i < input.length; i++){
          if(input[i].age <= Maxage)
              out.push(input[i]);
      }     
    return out;
  };
});

function Main($scope){

    $scope.users = [{name: 'Marcel Sapin',age: 26}, 
                            {name: 'Anhel De Niro',age: 42}, 
                            {name: 'Johny Resset',age: 30}]
}    

var myApp=angular.module（'myApp'，[]）；
myApp.filter（'ageFilter'，function（）{
返回函数（输入，最大值）{
var out=[]；
对于（变量i=0；iif（input[i].age您应该使用角度过滤器，如，但我不太清楚如何为OYU执行此操作。实际上，目前您正在补充。您可以使用一个控制器而不是两个，自定义过滤器i不需要硬编码“30”…我需要在ng Init中考虑maxAge。谢谢。我要说的是，在这种情况下，没有必要再观看maxAge…；）