Question

在我正在处理的项目中，视图中的许多复选框用于从搜索结果集中应用和删除一组过滤器。这些复选框的值将写入查询字符串，以便通过导航预加载过滤器状态。为了简化，我假装只有一个复选框，并忽略了应该进行一些过滤的事实。

为确保查询字符串中的状态正确，选中复选框后，将调用一个函数，该函数将复选框的值写入查询字符串。复选框的值绑定到名为“checkBoxValue”的范围属性。

<input ng-model="checkBoxValue" 
       ng-change="WriteValueToQueryString()"
       type="checkbox"/>

除此之外，当查询字符串有更新时，我调用一个函数，该函数从查询字符串中获取当前值并将其写入$ scope.checkBoxValue。它确保我的控制器中的值和查询字符串中的值彼此同步，无论值的变化源自何处。这一切的完全简化版本看起来像这样：

app = angular.module 'myApp', []

app.controller 'MyCtrl', ['$scope', '$location', ($scope, $location) ->

    $scope.GetValueFromQueryString = () ->
        queryStringValue = $location.search()['checkbox'] or false
        #making sure I write a true/false and not "true"/"false"
        $scope.checkBoxValue = queryStringValue is true or queryStringValue is 'true'

    $scope.WriteValueToQueryString = () ->
        $location.search 'checkbox', $scope.checkBoxValue.toString()

    $scope.$on '$locationChangeSuccess', () ->
        $scope.GetValueFromQueryString()
]

当我选中该框时，它会更改checkBoxValue，更新查询字符串中的值，一切都很可爱。如果我在浏览器中按“返回”按钮，它会注意到位置已更改，更新其值以匹配查询字符串（有效地撤消我的上一个），一切都很可爱。

...除非我使用的是Internet Explorer 10或11 ...

在IE10和IE11中，浏览器“返回”操作不会显示来执行任何操作。实际上，执行浏览器“后退”操作（当我查看它时，查询字符串在浏览器“后退”操作后读取它应该）。问题似乎是$ locationChangeSuccess永远不会触发。因此，永远不会从查询字符串中检索该值，这意味着我的复选框的实际值永远不会从查询字符串中更新。最后，如果你足够按下“返回”，它只会引导你到你进入我自己的页面之前你所处的实际页面，复选框仍处于你开始点击“返回”之前的状态。

有趣的是？ IE8和IE9对此没有任何问题。

链接到CodePen（在IE10或IE11中试用）：http://codepen.io/anon/pen/zaGwt/

感谢您阅读我的漫长时间。对此问题给予的任何帮助都将非常感激！

我尝试过的事情

$scope.$watch ( () -> $location.search() ), () ->
    $scope.GetValueFromQueryString()

其行为似乎与上面列出的相同。没有骰子。

$ locationChangeSuccess在IE10和IE11中没有触发浏览器返回操作

0 个答案: