如何在 angular 中访问另一个视图的 $scope?
How to access another view's $scope in angular?
我使用 AngularJS 构建 Web 应用程序。现在我使用 AngularJS YouTube 的嵌入插件。准确地说:https://github.com/brandly/angular-youtube-embed.
现在我通过以下事件侦听器暂停我的视频:player.pauseVideo();
。我已将此添加到按钮。
YouTube 嵌入与调用上述函数在同一页面上。
该对象的标记是:
<youtube-video video-id="video" id="youtube-video" player="player" style="height:450px; width: 100%"></youtube-video>
对象的播放器属性是您应该用来在对象和函数调用之间获取 link 的属性。
但现在我还想在另一个单独的视图 html 文档中访问播放器对象。该页面上的功能不会暂停 view.html.
上的视频
有谁知道如何使用类似 player.pauseVideo();
.
的调用来访问另一个页面上的对象
我假设 "player object" 你指的是范围变量 $scope.player
而 "another page" 你指的是另一个视图,具有不同的范围,渲染到播放器视图所在的同一 html 文档 中。
如果我对这些假设的看法是正确的,那么您基本上有两个选择,它们都是有效的 w.r.t。 "angular way".
使用全局控制器
您可以在 html 文档中引入一个页面范围的控制器(我们称之为 MasterController)并在那里定义 $scope.player
。然后,您可以在嵌套到 MasterController 中的每个控制器中访问 $scope.player
。请注意,您 不得 为嵌套控制器上的 $scope.player
赋值,因为这会阻止原型继承机制。
使用事件
angular 中的每个作用域都是 $rootScope
的子作用域。通过在需要从播放器触发功能的控制器中使用 $rootScope.$broadcast
并在播放器所连接的控制器中使用 $scope.$listen
,您可以从应用程序中的每个可能位置控制播放器。
要确定哪种方式更适合您的用例,请考虑以下属性:
- 事件是 'one-way roads',如果您需要从玩家范围之外检索玩家的任何值(例如,它的当前播放位置),则需要以相反的方式实现相同的机制,而使用全局控制器就像编写
$scope.player
一样简单
- 事件支持非耦合、可重用组件的开发。如果您要实现一个视频中心,它除了 youtube 之外还支持 vimeo 和其他平台,您可以通过使用事件抽象出所有这些不同插件的控制,只需插入新的视频平台,而无需修改其他视图控制器.
我推荐这本书“Learning JavaScript Design Patterns" by Addy Osmani and the angular guide on scopes
我使用 AngularJS 构建 Web 应用程序。现在我使用 AngularJS YouTube 的嵌入插件。准确地说:https://github.com/brandly/angular-youtube-embed.
现在我通过以下事件侦听器暂停我的视频:player.pauseVideo();
。我已将此添加到按钮。
YouTube 嵌入与调用上述函数在同一页面上。 该对象的标记是:
<youtube-video video-id="video" id="youtube-video" player="player" style="height:450px; width: 100%"></youtube-video>
对象的播放器属性是您应该用来在对象和函数调用之间获取 link 的属性。
但现在我还想在另一个单独的视图 html 文档中访问播放器对象。该页面上的功能不会暂停 view.html.
上的视频有谁知道如何使用类似 player.pauseVideo();
.
我假设 "player object" 你指的是范围变量 $scope.player
而 "another page" 你指的是另一个视图,具有不同的范围,渲染到播放器视图所在的同一 html 文档 中。
如果我对这些假设的看法是正确的,那么您基本上有两个选择,它们都是有效的 w.r.t。 "angular way".
使用全局控制器
您可以在 html 文档中引入一个页面范围的控制器(我们称之为 MasterController)并在那里定义 $scope.player
。然后,您可以在嵌套到 MasterController 中的每个控制器中访问 $scope.player
。请注意,您 不得 为嵌套控制器上的 $scope.player
赋值,因为这会阻止原型继承机制。
使用事件
angular 中的每个作用域都是 $rootScope
的子作用域。通过在需要从播放器触发功能的控制器中使用 $rootScope.$broadcast
并在播放器所连接的控制器中使用 $scope.$listen
,您可以从应用程序中的每个可能位置控制播放器。
要确定哪种方式更适合您的用例,请考虑以下属性:
- 事件是 'one-way roads',如果您需要从玩家范围之外检索玩家的任何值(例如,它的当前播放位置),则需要以相反的方式实现相同的机制,而使用全局控制器就像编写
$scope.player
一样简单
- 事件支持非耦合、可重用组件的开发。如果您要实现一个视频中心,它除了 youtube 之外还支持 vimeo 和其他平台,您可以通过使用事件抽象出所有这些不同插件的控制,只需插入新的视频平台,而无需修改其他视图控制器.
我推荐这本书“Learning JavaScript Design Patterns" by Addy Osmani and the angular guide on scopes