Question

我有一个angularjs应用程序，我在这里调用一个以条形为参数的函数foo（bar）。该栏是来自web api的数据。我使用ng-repeat循环遍历这些数据，所有工作都很好e-g

<li class="list-group-item" ng-repeat = "tag in subreddit.tags">
        <a href="javascript:void(0);" ng-click="subreddit.getData(tag)" target="_blank">{{tag.data.url}}</a>

      </li>

这里getData函数效果很好。现在在同一个应用程序中，我定义了另一个getData实例，如下所示：

    <button class="btn btn-success btn-block" ng-click="subreddit.getData(tag);">Load Feeds...</button>

这次得到的数据不会那么明显，因为参数标签是未定义的，而在ng-repeat的情况下它是从数据中传来的。

我知道很难重新解释这个问题所以我提出了一个演示来说明这个问题。

重现的步骤：

点击reddit链接，数据正确填充，如您在控制台中所见

但是如果你点击红色按钮Load Feeds，它调用相同的功能，它不起作用。有人可以告诉我如何使这个工作或我做错了什么。

问题演示：

http://jsbin.com/xexawumojo/edit?html,js,output

Answer 1

您没有定义另一个仍然使用相同控制器的实例，但现在，因为您已经编写了没有有效数据对象的实例。因为你不在重复循环中，所以标签是未知的。

您可以添加鼠标单击处理程序以将所选标记保存在控制器中，并使用此标记进一步加载。

Answer 2

我真的不明白这个问题，但在这里我认为你已经误解了这里的概念是可以帮助你的程序。

<!DOCTYPE html>
<html ng-app="MyApp">
<head>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.0/angular.min.js"></script>
  <meta charset="utf-8">
  <title>JS Bin</title>
</head>
<body>
  <div class="first" ng-controller="SubRedditController as subreddit">

   <ul class="list-group">
    <!-- you have declared tag variable over here so scope of the tag variable will be in below li only
    {from here -->
      <li class="list-group-item" ng-repeat = "tag in subreddit.tags">
        <a href="javascript:void(0);" ng-click="subreddit.getTagAssociatedData(tag)" target="_blank">{{tag.data.url}}</a>

      </li>
    <!-- to here} -->

     <ul>
        <li class="list-group-item" ng-if="subreddit.full_description">
        {{subreddit.full_description.description}}
        <!-- <button class="btn btn-success btn-block" ng-click="subreddit.getTagAssociatedData(tag);">Load Feeds...</button> -->
        <!-- you can not access tag variable over here because it is undefined. -->
      </li>
     </ul>
  </div>

</body>
</html>

由于您传递的值未定义，因此将调用此类函数

vm.getTagAssociatedData = function(data) { 
// as data is undefined in second case          
var full_description = data.data; // full_description = undefiend
vm.full_description = full_description; // vm.full_description = undefined  
          console.log(data); // no output
        }

在两个地方调用相同的函数仅适用于一个实例

2 个答案: