1

我有类似的东西:

<div ng-controller="ControllerA">
    <input type="text" id="search_form" value="Search" ng-model="searchModel" />
</div>

<div ng-controller="ControllerB">
    <ul>
        <li ng-repeat="item in items | filter:searchModel">{{item}}</li>
    </ul>
</div>

但是当我在输入栏中搜索时,它不会影响我的列表。如何让我的模型从一个控制器影响另一个控制器的内容?

谢谢。

编辑

ControllerA并且ControllerB彼此完全隔离,我想保持这种状态。如果我需要与其他控制器共享模型,我将如何使用$rootScope它?

4

2 回答 2

1

您可以使用 aservice在控制器之间共享数据。使用角度必须定义的工厂service功能。

这是我在这里找到的一个示例,使用简单的谷歌搜索。

<!doctype html>
<html ng-app="project">
<head>
    <title>Angular: Service example</title>
    <script src="http://code.angularjs.org/angular-1.0.1.js"></script>
    <script>
var projectModule = angular.module('project',[]);

projectModule.factory('theService', function() {  
    return {
        thing : {
            x : 100
        }
    };
});

function FirstCtrl($scope, theService) {
    $scope.thing = theService.thing;
    $scope.name = "First Controller";
}

function SecondCtrl($scope, theService) {   
    $scope.someThing = theService.thing; 
    $scope.name = "Second Controller!";
}
    </script>
</head>
<body>  
    <div ng-controller="FirstCtrl">
        <h2>{{name}}</h2>
        <input ng-model="thing.x"/>         
    </div>

    <div ng-controller="SecondCtrl">
        <h2>{{name}}</h2>
        <input ng-model="someThing.x"/>             
    </div>
</body>
</html>
于 2014-06-18T20:02:01.067 回答
0

如果您有一个需要共享的模型,您应该使用一个服务,这样两个控制器都可以访问数据并了解任何更改

于 2014-06-18T19:57:27.890 回答