AngularJS -访问ng-view之外的元素
我有一个带有ng-view (管理面板)的设置，可以让我显示订单。我在ng-view之外有一个搜索框，我想用它来修改我的json请求。我看过一些关于访问标题等内容的帖子，但无法让它们正常工作--可能已经过时了。
app的主要内容：
angular.module('myApp', ['myApp.controllers', 'myApp.filters', 'myApp.services', 'myApp.directives', 'ui.bootstrap']).
config(['$routeProvider', '$locationProvider', function($routeProvider, $locationProvider) {
$routeProvider.
when('/', {
templateUrl: '/partials/order/manage.html',
controller: 'ManageOrderCtrl'
}).
when('/order/:id', {
templateUrl: '/partials/order/view.html',
controller: 'ViewOrderCtrl'
}).
otherwise({
redirectTo: '/'
});
$locationProvider.html5Mode(true);
}]);管理控制器：
angular.module('myApp.controllers', [])
.controller('ManageOrderCtrl', ['$scope', '$http', '$dialog', 'config', 'Page', function($scope, $http, $dialog, config, Page) {
// would like to have search value from input #search available here
var getData = function() {
$http.get('/orders').
success(function(data, status, headers, config) {
$scope.orders = data.orders;
});
};
getData();
})查看：
<body ng-app="myApp" >
<input type="text" id="search">
<div class="ng-cloak" >
<div ng-view></div>
</div>
</body>回答 3
Stack Overflow用户
发布于 2013-04-16 15:10:29
如果您要访问<div ng-view></div>之外的内容，我认为更好的方法是也为外部区域创建一个控制器。然后创建一个服务来在控制器之间共享数据：
<body ng-app="myApp" >
<div ng-controller="MainCtrl">
<input type="text" id="search">
</div>
<div class="ng-cloak" >
<div ng-view></div>
</div>
</body>(也可以将视图放在<body>标记上-那么ng-ng-controller="MainCtrl" $scope将是MainCtrl $scope的子级，而不是同级。)
创建服务就像这样简单：
app.factory('Search',function(){
return {text:''};
});它可以像这样注入：
app.controller('ManageOrderCtrl', function($scope,Search) {
$scope.searchFromService = Search;
});
app.controller('MainCtrl',function($scope,Search){
$scope.search = Search;
});这样你就不必依赖于通过全局$rootScope共享数据(这有点像在javascript中依赖全局变量-无论出于何种原因，这都不是一个好主意)，或者通过一个可能存在也可能不存在的$parent作用域。
我已经在两个解决方案之间创建了一个 that tries to show the difference。
Stack Overflow用户
发布于 2013-09-25 23:24:34
您可以使用作用域层次结构。
将“外部”ng-controller定义添加到您的超文本标记语言中，如下所示：
<body ng-controller="MainCtrl">它将成为$parent作用域。但是您不需要通过使用服务来共享数据。您甚至不需要使用$scope.$parent作用域。您可以使用。(请参阅该页面上的范围层次结构部分)。这真的很简单。
在您的MainCtrl中，您可能会有以下内容：
$scope.userName = "Aziz";然后，在任何嵌套在MainCtrl中的控制器(并且不会覆盖自己作用域中的userName )中也会有userName！您可以在视图中使用{{userName}}。
Stack Overflow用户
发布于 2013-04-16 14:33:03
试试这个。
查看：
<body ng-app="myApp" >
<input type="text" id="search" ng-model="searchQuery" />
<div class="ng-cloak" >
<div ng-view></div>
</div>
</body>在你的控制器中使用它：
$http.get('/orders?query=' + $scope.searchQuery).
success(function(data, status, headers, config) {
$scope.orders = data.orders;
});基本上，你可以用ng-app中的任何东西来做这件事……将您的ng-app移动到html标记，您也可以编辑title！
https://stackoverflow.com/questions/16028678
复制相似问题
腾讯云开发者
Copyright © 2013 - 2026 Tencent Cloud. All Rights Reserved. 腾讯云 版权所有
深圳市腾讯计算机系统有限公司 ICP备案/许可证号：粤B2-20090059 
粤公网安备44030502008569号
腾讯云计算（北京）有限责任公司 京ICP证150476号 | 京ICP备11018762号