使用at.js在angular js中@name标记

时间:2018-09-19 10:36:10

标签: javascript jquery angularjs at.js

我正在尝试使用angular。中的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');  

1 个答案:

答案 0 :(得分:0)

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

对我来说,我正在使用带有$ timeout的AngularJS组件来确保渲染周期结束,或者可以使用$ postLink。

#urls.py
urlpatterns = [
                  path('admin/', admin.site.urls),
                  url(r'^api/foodfeed/', backend_views.FoodfeedList.as_view()),
              ] + static(settings.STATIC_URL, document_root=settings.STATIC_ROOT)


#views.py
class FoodfeedList(APIView):
    # permission_classes = (permissions.IsAuthenticated,)
    def get(self, request):
        print(request.GET) # print all url params
        print(request.GET['keywords'])
        print(request.GET['mood'])
        # etc

Check my component for wrapping at-who line 345