Вызов одной и той же функции в двух местах работает только для одного экземпляра.

0

У меня есть приложение angularjs, где я вызываю функцию foo (bar), которая принимает значение bar в качестве параметра. Панель представляет собой данные, поступающие из web api. Я просматриваю эти данные с помощью ng-repeat, и все работает хорошо, например

<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, и данные заселяются правильно, как вы можете видеть на консоли

но если вы нажмете на красную кнопку "Загрузить каналы", которая вызывает ту же функцию, она не работает. Может кто-нибудь, пожалуйста, скажите мне, как заставить это работать или что я делаю неправильно.

Демо-версия:

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

  • 0
    Не могу понять, как вы ожидаете, что это сработает. Функция получает параметр, и у вас ничего нет в случае кнопки. Какой тег вы хотите использовать при нажатии кнопки? Проблема здесь в логике, а не в коде
Теги:
angular-promise

2 ответа

0

Я действительно не понимаю вопроса, но здесь я думаю, что вы пропустили понимание концепции здесь - программа, которая может вам помочь.

<!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
        }
0

Вы не определяете другой экземпляр, который по-прежнему используете тот же контроллер, но теперь, поскольку вы уже пишете без действительного объекта данных. потому что вы вышли из цикла повторения и поэтому тег неизвестен.

Вы можете добавить обработчик щелчка мыши для сохранения выбранного тега в контроллере и использовать этот тег для дальнейшей загрузки.

Ещё вопросы

Сообщество Overcoder
Наверх
Меню