在ng-repeat之后执行jQuery函数 [英] executing jQuery function after ng-repeat

问题描述

在此先感谢您的帮助.我在Web应用程序中使用了 tagmanager .直到此为止，jQuery函数都可以正常工作

Thanks in advance for your help. I'm using this tagmanager in my web application. The jQuery function works FINE until this

<input type="text" name="tags" placeholder="Tags" class="tagsManager" />

位于

ng-repeat = "(key,val) in client_proj"

这是该代码的一小段

<div class="accordion-group" ng-repeat="(key,val) in client_proj"><!--For Every Project in Project List-->
  <div class="accordion-heading" style="background-color:#EFF8FB">
    <a class="accordion-toggle" data-toggle="collapse" data-parent="#mainAccordion" href="#{{val.id}}" ng-click="disableEditor()">
      <div align="center">{{val.title}}</div>
    </a>
  </div>
  <div id="{{val.id}}" class="accordion-body collapse">
    <div class="accordion-inner" style="font-size:12px; background-color:white">
      <strong>Technologies Exposure:</strong><br/>
      <div ng-hide="editorEnabled">{{val.exposure}}</div>
      <div ng-show="editorEnabled">
        <textarea ng-show="editorEnabled" class="span12" ng-model="val.exposure" rows="12" style="resize:vertical"></textarea>
        <input type="text" name="tags" placeholder="Tags" class="tagsManager" />

它看起来像是普通输入，没有执行任何功能，例如在按下或输入后创建新标签.

It appears as a normal input without doing any of its functions like creating a new tag after pressing, or enter.

谁能告诉我发生了什么事?

Can anyone tell me what's happening?

推荐答案

1.创建一个自定义指令，充当jQuery插件的包装器:

1.Create a custom directive that acts as a wrapper for your jQuery plugin:

angular.module('<YOUR APP OR MODULE>').directive('tagsManager', function () {
    return {
        restrict: 'A',
        link: function (scope, element, attrs) {
            element.tagsManager();
            //whatever other logic would go here
        }
    };
});

然后删除tabsManager的自动初始化(类似 $('< SELECTOR>').tagsManager(); 或 jQuery('< SELECTOR>').tagsManager(); )

Then remove the automatic initialization of tabsManager (something like $('<SELECTOR>').tagsManager(); or jQuery('<SELECTOR>').tagsManager(); ) from your script

最终，在您的ng-repeat中，将指令添加到输入元素中(可选地，添加其他属性-如果需要，您可能必须在指令中对这些属性的行为进行编程)

Ultimately, in your ng-repeat, add the directive to the input element (optionally add other attributes -- you might have to program the behavior for these attributes within your directive -- if they are required)

<input tags-manager>

这将使AngularJS在您的输入(通过自定义指令)上在DOM中呈现后初始化tabsManager.

This will make AngularJS initialize tabsManager on your inputs (via the custom directive) after they are rendered in the DOM.

有道理吗?

这篇关于在ng-repeat之后执行jQuery函数的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！