使用 at.js 在 Angular js 中进行 @name 标记答案

【问题标题】：@name tagging in angular js with at.js使用 at.js 在 Angular js 中进行 @name 标记
【发布时间】：2018-09-19 10:36:09
【问题描述】：

我正在尝试使用 at.js 以角度创建带有用户标记的评论框。但是这里实际上没有响应此代码

<div ng-reapet ="user_data in data">
  {{data.content}}
  <input type="text" ng-model="user_content"  class="user_content"  id="user_content" >         
</div>

$(function(){
          $.fn.atwho.debug = true;
            var names = ["Jacob","Isabella","Ethan","Emma",,"Emily","Daniel","Madison"];

  var names = $.map(names,function(value,i) {
  return {'id':i,'name':value,'email':value+"@email.com"};
});


var at_config = {
     at: "@",
     data: names,
     headerTpl: '<div class="atwho-header">Member List<small>↑&nbsp;↓&nbsp; 
       </small></div>',
     insertTpl: '${name}',
     displayTpl: "<li>${name} <small>${email}</small></li>",
     limit: 200
};

$inputor = $(".user_content").atwho(at_config);
$inputor.caret('pos', 47);
$inputor.focus().atwho('run');

【问题讨论】：

标签： javascript jquery angularjs at.js

【解决方案1】：

您需要确保在 AngularJS 完成其渲染周期后运行 atwho 代码。

对我来说，我使用带有 $timeout 的 AngularJS 组件来确保渲染周期完成，或者您可以使用 $postLink。

$timeout(function () {
      atWhoWrapper.draw(element, atWhoOptions, otherCopyOptions);
}, 100);

Check my component for wrapping at-who line 345.

【讨论】：

非常感谢@yazan.aabed