Angularjs 角度-将视图连接到其他和/或父零部件
我有一个angular应用程序，它有一个Angularjs 角度-将视图连接到其他和/或父零部件,angularjs,Angularjs,我有一个angular应用程序，它有一个ng视图，它（像任何好的MVC一样）控制模型的显示方式。数据（模型）来自数据库，我将其调用到应用程序的组件中。从那里，我想将模型传播到ng视图，该视图加载一个模板以显示基于路线的数据。我还希望能够使用“顶栏”过滤进入视图的数据/模型 即： INDEX.HTML: <html ng-app="app"> <head>...</head> <body ng-controller="appController">
ng视图ng视图路线的数据。我还希望能够使用“顶栏
”过滤进入视图的数据/模型
即：
INDEX.HTML:
<html ng-app="app">
<head>...</head>
<body ng-controller="appController">
<top-bar></top-bar>
<div ng-view></div>
</body>
</html>
angular.module('app', ['top-bar','view-one','view-two', 'ngRoute']);
angular.module('app').controller('appController', function() {
var self = this;
this.myData = [];
$http.get('theQuery').then(res => self.myData = res.data);
});
angular.config(function($routeProvider, $locationProvider) {
$routeProvider
.when('/view-one', {template:'<view-one></view-one>'})
.when('/view-two', {template:'<view-two></view-two>'});
});
angular.module('top-bar', ['ngRoute']);
angular.module('top-bar').component('top-bar', {
templateUrl: './app/top-bar/top-bar.template.html',
controller: function(filterFilter) {
this.filters = filterFilter(...);
}
});
angular.module('view-one', ['ngRoute']);
angular.module('view-one').component('view-one', {
templateUrl: './app/view-one/view-one.template.html',
controller: function(filterFilter) {
// appController.data and topBar.filters would somehow
// need to be gotten from those respective modules.
this.data = appController.data;
this.filter = topBar.filters;
}
});
...
APP.JS:
<html ng-app="app">
<head>...</head>
<body ng-controller="appController">
<top-bar></top-bar>
<div ng-view></div>
</body>
</html>
angular.module('app', ['top-bar','view-one','view-two', 'ngRoute']);
angular.module('app').controller('appController', function() {
var self = this;
this.myData = [];
$http.get('theQuery').then(res => self.myData = res.data);
});
angular.config(function($routeProvider, $locationProvider) {
$routeProvider
.when('/view-one', {template:'<view-one></view-one>'})
.when('/view-two', {template:'<view-two></view-two>'});
});
angular.module('top-bar', ['ngRoute']);
angular.module('top-bar').component('top-bar', {
templateUrl: './app/top-bar/top-bar.template.html',
controller: function(filterFilter) {
this.filters = filterFilter(...);
}
});
angular.module('view-one', ['ngRoute']);
angular.module('view-one').component('view-one', {
templateUrl: './app/view-one/view-one.template.html',
controller: function(filterFilter) {
// appController.data and topBar.filters would somehow
// need to be gotten from those respective modules.
this.data = appController.data;
this.filter = topBar.filters;
}
});
angular.module（'app'，['top-bar'，'view-one'，'view-two'，'ngRoute']）；
角度.module（'app'）.controller（'appController'，function（）{
var self=这个；
this.myData=[]；
$http.get（'theQuery'）。然后（res=>self.myData=res.data）；
});
配置（函数（$routeProvider，$locationProvider）{
$routeProvider
.when（'/view one'，{模板：'}）
.when（'/view two'，{template:'}）；
});
角度模块（'top-bar'，['ngRoute']）；
角度。模块（‘顶栏’）。组件（‘顶栏’{
templateUrl:'./app/top bar/top bar.template.html'，
控制器：功能（过滤器过滤器）{
this.filters=filterFilter（…）；
}
});
角度模块（'view-one'，['ngRoute']）；
角度。模块（‘视图一’）。组件（‘视图一’{
templateUrl:'./app/view one/view one.template.html'，
控制器：功能（过滤器过滤器）{
//appController.data和topBar.filters会以某种方式
//需要从相应的模块中获取。
this.data=appController.data；
this.filter=topBar.filters；
}
});
我试图弄明白的是如何从主应用程序的控制器（appController
）和顶栏
组件获取数据，并将其发送到当前加载到ng view
的任何视图
我一直在搜索web，我找不到更好的方法是使用binding
（即binding:{data:'推荐的方法是创建一个服务，并让不同的控制器使用该服务提供的对象的引用
可能重复的