Question

在我的应用程序中，我有两个控制器，在第一个控制器中，我有一个文本input和ul，以便我可以使用filter:$rootScope.test过滤列表，在另一个控制器中只有ul。我想要的是能够并行地从第一个（namesCtrl）和第二个控制器（x）过滤ul。我使用$rootScope作为模型，它正在使用第一个控制器，但不在第二个控制器中。有人可以在同一时间显示如何过滤第一个控制器的ul和第二个控制器吗？

＆＃13;

<!DOCTYPE html>
<html>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script>
<script
  src="https://code.jquery.com/jquery-3.1.1.min.js"
  integrity="sha256-hVVnYaiADRTO2PzUGmuLJr8BLUSjGIZsDYGmIJLv2b8="
  crossorigin="anonymous"></script>
<body>

<div ng-app="myApp" >
<div ng-controller="namesCtrl">
<p>Type a letter in the input field:</p>

<p><input type="text" id="dSuggest" ng-model="$rootScope.test" ></p>

<ul>
  <li ng-repeat="x in names | filter:$rootScope.test">
    {{ x }}
  </li>
</ul>

</div>
<hr/>
<div ng-controller="x">
<ul>

  <li ng-repeat="x in names | filter:$rootScope.test">
    {{ x }}
  </li>
</ul>
</div>
</div>

<script>
$('#dSuggest').on("input", function(d){console.log($('#dSuggest').val())});
var app = angular.module('myApp', []).controller('namesCtrl', function($scope) {
    $scope.names = [
        'Jani',
        'Carl',
        'Margareth',
        'Hege',
        'Joe',
        'Gustav',
        'Birgit',
        'Mary',
        'Kai'
    ];
});
app.controller('x', function($scope, $rootScope) {
    console.log($rootScope);
    $scope.names = [
        'Jani',
        'Margareth',
        'Hege',
        'Joe',
    ];
})
</script>
<p>The list will only consists of names matching the filter.</p>
</body>
</html>

＆＃13;

Answer 1

只需从namesCtrl控制器中删除您的输入，例如：

...
<div ng-app="myApp" >
<div >
<p>Type a letter in the input field:</p>

<p><input type="text" id="dSuggest" ng-model="$rootScope.test" ></p>

<ul ng-controller="namesCtrl">
  <li ng-repeat="x in names | filter:$rootScope.test">
    {{ x }}
  </li>
</ul>
...

Angularjs - 从另一个控制器过滤ul

1 个答案: