element.text () после рендеринга элемента

0

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

app.directive('newEl', function($compile) {
    return {
        link: function($scope, element) {

        console.log("link element : ", element.text())

        }, controller: function($scope, $element) { 

        console.log("controller text ",$element.text())           
        }
      }     
});
  • 0
    Во-первых, необязательно требовать. Но в любом случае, получение текста элемента настолько странно ... зачем тебе это? Что именно делает метка-данные? Можно ли заменить на фильтр? кажется, что вы смешиваете вид и модель ...
  • 0
    @PetrAveryanov, на самом деле я делаю текст редактируемым по щелчку в этой директиве, поэтому я добавляю поведение onclick, которое рисует текст с сохранением и отменой, все, что мне остается, это фактический текст элемента, поэтому я помещаю начальное значение для редактирования внутри этого текста.
Показать ещё 2 комментария
Теги:
angularjs-directive
angularjs-ng-repeat

2 ответа

0
Лучший ответ

Вы можете попробовать использовать $timeout, чтобы убедиться, что выражение тайм-аута запускается после цикла дайджеста, и данные привязаны к DOM. Поскольку у вас есть ng-repeat на том же элементе, вы можете убедиться, что элемент отображается только после того, как у вас есть данные, привязанные к нему.

  $timeout(function(){
     console.log("link element : ", element.text(), $scope.item)
  }, 0, false); //set false if you dont want to trigger a digest

Но странно это делать, но вместо этого вы можете использовать выделенную ограниченную директиву и привязать значение item туда с помощью двусторонней привязки.

В настройках вашей директивы:

 {
   scope:{item:'='}
 },

и получить доступ к нему как $scope.item в вашей директиве. Вы также можете использовать controllerAs и bindToController и получить item как свойство экземпляра контроллера с этим. Избегайте доступа к $element в вашем контроллере, и вы можете использовать эту технику. Изолированный объем позволяет создавать автономный компонент без жесткой связи с потребителем.

Или так же просто, как установить его как атрибут для edit-text т.е.

<td ... edit-text="item" ng-repeat="item in items">{{item}}</td>

и в вашей директиве:

var item = $scope.$eval(attrs.editText);

Кроме того, поскольку ваша директива не создает область видимости, вы также можете получить доступ к ней как $scope.item но не рекомендуется, так как она недостаточно $scope.item и есть некоторые предположения относительно родителя.

angular.module('app', []).run(function($timeout, $rootScope) {
  $timeout(function() {
    $rootScope.items = [1, 2, 3, 4, 5, 6, 7];
  }, 2000);

}).directive('editText', function($compile, $timeout) {
  return {
    link: function($scope, element, attrs) {
      console.log($scope.$eval(attrs.editText), $scope.item);
      $timeout(function() {
        console.log("link element : ", element.text())
      });

    },
    controller: function($scope) {


    }
  }
});
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.0/angular.min.js"></script>
<div ng-app="app">

  <div edit-text="item" ng-repeat="item in items">{{item}}</div>

</div>
Поделиться
0

В первую очередь вы можете попытаться использовать angular.element.ready. Второй - postLink.

Поделиться
  • 0
    что не сработало, даже не сработало

Ещё вопросы

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