javascript - 将 $scope 放在 Cytoscape 点击事件中

Question

我使用 Cytoscapejs 创建了一个网络图。我正在尝试取消隐藏一个 div，并在用户单击图形边缘后加载更多内容。

我的 Controller 中有以下内容:

CytoscapeService.getGraph().on('tap', 'edge[id = "123"]', function (event) {

console.log("Hi")
//Above console printout works.

  //The below does not work on index.html
  $scope.testMessage = "Hello World";
  $scope.showMe = function () {
    $scope.show = true;
  }

  $scope.showMe();

});

// This works though.
//$scope.testMessage = "Hi from outside";

在 Index.html 中:

<div  ng-controller="MainCtrl" class="container" ng-show="show">

</div>

<div  ng-controller="MainCtrl">
  {{testMessage}}
</div>

console.log 确实打印出来了，但是没有调用里面有函数的 $scope.showMe。但是，如果我将范围移到该子句之外，移到 Controller 的主子句中，它就可以工作。

关于我如何实现这一目标，有什么替代方案吗？

Answer 1

当您使用 jquery 事件更新 $scope 值时，这在 angular 中很常见。您将必须手动触发 $scope 应用:

$scope.$apply(function(){
    $scope.show = true;
});

另一个解决方案是使用 Angular 的 $timeout

$timeout(function () {
    $scope.show = true;
});

请参阅 $scope.apply() 的文档和 more scope information .