Angular функция директивной ссылки, называемая дважды

В моем приложении angular директивы работают нормально во время первого посещения, но после того, как страница была посещена дважды, вся функция директивной ссылки вызывается дважды. Скажем, я на странице A, щелкните ссылку, чтобы перейти на страницу B, а затем вернуться на страницу A, все директивы на странице A будут выполнять свою функцию связи дважды. если я обновляю браузер, он снова станет нормальным.

Вот пример, когда console.log будет выводить дважды при втором посещении.

  @app.directive 'testChart', ["SalesOrder", (SalesOrder) ->
    return {
      scope: {options: '='}
      link: (scope, elem, attrs) ->
        console.log("............checking")
        SalesOrder.chart_data (data) ->
          Morris.Line
            element: "dash-sales"
            data: data
            xkey: 'purchased_at'
            ykeys: ['total']
            labels: ['Series a']
    }
  ]

Любая идея?

Update

Мой маршрут

когда ( "/dash", {   templateUrl: "<% = asset_path ('app/views/pages/dash.html')% > ",   контроллер: DashCtrl }).

поэтому моя диаграмма дублируется enter image description here

Ответы

Ответ 1

также убедитесь, что вы не указали свою директиву в index.html TWICE!

Ответ 2

Функция link() вызывается каждый раз, когда элемент должен привязываться к данным в объекте $scope.

Пожалуйста, проверьте, сколько раз вы извлекаете данные, используя GET-вызов. Вы можете отслеживать извлечение ресурсов через вкладку "Сеть", отладчика хрома.

Директива настраивает элемент HTML, а затем обновляет этот HTML-код каждый раз, когда изменяется объект области $.

Лучшее имя для функции link() было бы чем-то вроде bind() или render(), который сигнализирует, что эта функция вызывается всякий раз, когда директиве необходимо привязать данные к ней или повторно отобразить ее.

Ответ 3

У меня была такая же проблема. После loooooong времени копания вокруг я обнаружил, что я не использовал правильный закрывающий тег, в результате чего график вызывается дважды.

У меня был

<line-chart><line-chart>

вместо

<line-chart></line-chart>

Ответ 4

Может быть, это поможет кому-то...

У меня была проблема с директивой transclude, я использовал функцию transclude, которая добавляла дочерние элементы, и в то же время я забыл ng-transclude в шаблоне директивы. Детскими элементами также были директивы, и их функция link вызывалась дважды!

Прошло некоторое время на этом.

Подробнее:

У меня были директивы "main" и "child", идея заключалась в том, чтобы использовать один внутри другого, что-то вроде этого:

main
    child
    child

Таким образом, проблема заключалась в том, что link директивы "child" вызывается дважды, и я не понимал, почему,

Оказалось, что у меня есть ng-transclude в шаблоне директивы main (я отправляю его, как и в формате PUG, извините за это):

md-card(layout-fill)
  md-card-content(flex)
    .map-base(id="{{::config.id}}", layout-fill)
      ng-transclude

а также в функции link из "основной" директивы, которую я называл функцией пересылки:

link: function($scope, $element, $attrs, controller, transcludeFn) {
  $element.append(transcludeFn());
}

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

Таким образом, проблема заключается в том, что вы не можете иметь обоих, и вам нужно выбрать один из способов.

Надеюсь, теперь это станет более ясным.

Ответ 5

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