Question

我有以下代码片段，

<div ng-controller="GraphCtrl" ng-if="errorTracerouteResultsLength!=0">
  <h5>Erroneous Traceroute Paths
    <small>Sub-heading</small>
  </h5>

  <a href="#"  ng-repeat="(key, val) in errorTracerouteResults" ng-click="loadTraceroutePath(val.metadata);">
    S: {{val.source.ip}}
    D: {{val.destination.ip}}
  </a>
</div>

它工作正常，loadTraceroutePath属于另一个控制器，（让我们称之为X）但不知何故ng-click工作，console.log以正确的元数据值打印出来。

然而，在控制器X中，我有，

$scope.loadIndividualTraceroutePath = function (metadataKey) {
   $scope.noOfResults = 1;
}

在html中，我到处都有{{noOfResults}}。其中一些能够显示1而一些不能显示。我已经附加了ng-controller指令并指向控制器X，但{{noOfResults}}没有显示。

如何在HTML的任何部分显示{{noOfResults}}？

编辑：我添加了HTML。

<div class="row">
  <div class="col-lg-9">
    <div class="panel panel-default">
      <div class="panel-heading">
        <i class="fa fa-bar-chart-o fa-fw"></i> Visualisation
        <div class="pull-right">
          Layout
        </div>
      </div>
      <!-- /.panel-heading -->
      <div class="panel-body">

        <div class="container" ng-controller="X">
          <!--This does not work-->
          {{noOfResults}}
        </div>

        <div>

          <div ng-controller="IndividualTraceroutePathGraphCtrl" id="individual_traceroute_path_graph"></div>

        </div>

      </div>
      <!-- /.panel-body -->
    </div>
    <!-- /.panel -->
  </div>

此问题第一部分中的ng点击如下。

Answer 1

你最后还有一个;，你也没有使用你传递的对象作为函数的参数，因此改变

自：

<a href="#"  ng-repeat="(key, val) in errorTracerouteResults" ng-click="loadTraceroutePath(val.metadata);">

要：

<a href="#"  ng-repeat="(key, val) in errorTracerouteResults" ng-click="loadTraceroutePath(val)">

然后，

$scope.loadIndividualTraceroutePath = function (metadataKey) {
   $scope.noOfResults = 1;
}

修改

你不需要在视图中提到这么多控制器，有一个控制器来定义函数并删除其余部分，在这里，像这样更新，

<div class="container" >  {{noOfResults}} </div> <div> <div id="individual_traceroute_path_graph"></div> </div> </div>

$ scope变量未在视图中更新

1 个答案: