当我单击浏览器的BACK按钮时，AngularJS的`$ location.path（）`没有改变？

Question

我正在使用videoJS动态加载视频，并希望在route或location更改时销毁视频播放器，我尝试将其包装在这样的指令中（Coffeescript代码）：

angular.module('myModule')
.directive('myDirective', ($location)->
  return {
  restrict: 'A'
  scope: {rawUrl: '='}
  link: (scope, element, attrs) ->    
    attrs.type = 'application/x-mpegURL'
    setup =
      controls: true
      preload: 'auto'
      autoplay: true
      height: window.innerHeight
      width: window.innerWidth
      'data-setup': '{example_option: true}'

    myPlayer = element

    scope.$watch('location.path()', ->
      # TODO: destroy videoJS when user leaves video page
      console.log($location.path())
      if not $location.path().match '/video/'
        console.log("destroy you!")
        videojs(attrs.id).dispose()

    )
    scope.$watch('rawUrl.videoUrl', (newvalue)->
      if newvalue
        player = videojs(attrs.id, setup, ->
          console.log('created')
          this.src(newvalue)
          return
        )
        videojs(attrs.id).ready( ->
          console.log('ready!')
          myPlayer = this
          aspectRatio = 9 / 16;
          resizeVideoJS = ->
            myPlayer.width(window.innerWidth).height(window.innerHeight);            )


   )
  }
)

但是，如果我使用broswer的BACK按钮更改页面，我发现scope.$watch('location.path(), mycallback)内的回调函数没有被调用..

有没有人有这方面的想法？谢谢！

Answer 1

只需使用scope.$on('$destroy', destroyCallback)

即可

Answer 2

我不是100％确定这会起作用，但你可以尝试在范围内定义的函数中包装$ location.path（）调用，例如

scope.location = { path : function () { return $location.path(); } }

同样，我不确定路由更改是否会在摘要周期之前发生。

如果确实如此，您可以使用以下方式收听位置更改事件（Angular doc on $location events）：

scope.$on('$locationChangeStart', function (event) { /* code you had in your watcher should still work fine here */ });

编辑：将$ route事件编辑为$ location事件（请参阅文档中的新链接和this answer。$ location位置事件应根据浏览器网址的变化进行广播。