我正在尝试创建一个角色项目,我在其中使用了包含。包含的页面需要相互通信。
问题似乎是包括创建自己的范围。但是我需要包含视图才能相互通信。
<!DOCTYPE html>
<html>
<head>
<script data-require="angular.js@*" data-semver="1.4.0-beta.6" src="https://code.angularjs.org/1.4.0-beta.6/angular.js"></script>
<link rel="stylesheet" href="style.css" />
<script src="script.js"></script>
</head>
<body ng-app="myApp">
<h1>Hello Plunker!</h1>
<div ng-controller="controller1">
<p>
test page 1:
<input type="text" ng-model="test" />
</p>
<p>value: {{test}}</p>
<!-- include page 2 -->
<ng-include src="'page2.html'"></ng-include>
<p>
What's strange is that binding appears to work for page1 input.
however when page 2 input is changed it almost creates it's own scope at that point!
</p>
<p>
Steps to reproduce: </p>
<ol>
<li>Edit input for page1 you should see that page 1 and 2 are modified.</li>
<li>Edit page 2 input, notice that page 1 isn't changed</li>
<li>Edit page 1 input, again notice that page 2 isn't changed!</li>
</ol>
</div>
</body>
</html>
第2页:
<div class="page2">
<h1> page2 </h1>
test page2: <input type="text" ng-model="test"/>
</div>
JavaScript的:
var app = angular.module('myApp',[]);
angular.module('myApp').controller('controller1', ['$scope',function($scope) {
$scope.test= "hello";
}]);
angular.module('myApp').controller('controller2', ['$scope',function($scope) {
}]);
我这里有一个插件(其中包含有关如何重现的说明)。 http://plnkr.co/edit/woyU4jfEvzMPDP1bv2Le?p=preview
我很感激任何帮助。