如何从 angularjs 中的 ng-include 切换控制器值?
How to switch controller values from ng-include in angularjs?
我正在使用 angularjs。我有一个 header.html
,我已经使用 ng-include 将 html 页面合并到另一个 html 页面。
此外,我在 header.html
中有一个下拉列表,我希望显示所选值(来自下拉列表)。我该怎么做?
header.html
<html ng-app="app" >
<head>
<script src="assets/js/jquery-2.1.4.min.js"></script>
<script src="controller/headerctrl.js"></script>
</head>
<body ng-controller="headerctrl">
<select id="valueid" class="form-control" required typeof="text" ng-model="valuselect" form="Floorform" >
<option value="">Select</option>
<option value="1">One</option>
<option value="2">Two</option>
<option value="3">Three</option>
</select>
</div>
</body>
</html>
Content.html
<html ng-app="app" >
<head>
<script src="assets/js/jquery-2.1.4.min.js"></script>
<script src="controller/Contentctrl.js"></script>
</head>
<body >
<div id="header" ng-controller="headerctrl" ng-include="'header.html'">
</div>
<div id="sidebar" class="sidebar responsive ace-save-state" ng-controller="Contentctrl" >
//hi this content page here i get header dropdown selected value
</div>
</body>
</html>
页眉控制器
var app = angular.module("app", []);
app.controller('headerctrl', ['$scope', '$http', '$window',
function ($scope, $http, $window, ) {
}]);
内容控制器
var app = angular.module("app", []);
app.controller('contentctrl', ['$scope', '$http', '$window',
function ($scope, $http, $window, ) {
}]);
您可以为其使用服务
app.factory('myService', function() {
var savedData = [];
return {
set: set,
get: get
}
function set(data) {
savedData.push(data)
}
function get() {
return savedData;
}
});
这是 plnkr
我正在使用 angularjs。我有一个 header.html
,我已经使用 ng-include 将 html 页面合并到另一个 html 页面。
此外,我在 header.html
中有一个下拉列表,我希望显示所选值(来自下拉列表)。我该怎么做?
header.html
<html ng-app="app" >
<head>
<script src="assets/js/jquery-2.1.4.min.js"></script>
<script src="controller/headerctrl.js"></script>
</head>
<body ng-controller="headerctrl">
<select id="valueid" class="form-control" required typeof="text" ng-model="valuselect" form="Floorform" >
<option value="">Select</option>
<option value="1">One</option>
<option value="2">Two</option>
<option value="3">Three</option>
</select>
</div>
</body>
</html>
Content.html
<html ng-app="app" >
<head>
<script src="assets/js/jquery-2.1.4.min.js"></script>
<script src="controller/Contentctrl.js"></script>
</head>
<body >
<div id="header" ng-controller="headerctrl" ng-include="'header.html'">
</div>
<div id="sidebar" class="sidebar responsive ace-save-state" ng-controller="Contentctrl" >
//hi this content page here i get header dropdown selected value
</div>
</body>
</html>
页眉控制器
var app = angular.module("app", []);
app.controller('headerctrl', ['$scope', '$http', '$window',
function ($scope, $http, $window, ) {
}]);
内容控制器
var app = angular.module("app", []);
app.controller('contentctrl', ['$scope', '$http', '$window',
function ($scope, $http, $window, ) {
}]);
您可以为其使用服务
app.factory('myService', function() {
var savedData = [];
return {
set: set,
get: get
}
function set(data) {
savedData.push(data)
}
function get() {
return savedData;
}
});
这是 plnkr