2017-02-27 4 views
0

私はにログインしたユーザー間でメッセージを配信するChat applicationに取り組んでいます。あるユーザーが他のユーザーとチャットするために送信するメッセージでは、いくつかのデザインを追加して、返信するオプションがあるようにしたいと考えています。このメッセージのリンクreplyとその中のangularタグng-clickにネストしようとしましたが、これはユーザーのためにmodal reply(下記参照)を開きます。<ng-click>をEndpoint.javaの文字列に挿入し、この文字列をクライアント側に送り返す方法はありますか?

ng-clickの内容は、ユーザーが返信したいメッセージIDを入力として取得する関数です。

私の問題は、replyをクリックすると、返信モーダルがユーザーに対して開かれていますが、この関数は呼び出されないことです。ここで

ChatEndPoint.javaで私のコードです:

String m="<div> 
      <div>" + 
       _content 
      + "</div> &nbsp; 
      <a href='#' data-toggle='modal' data-target='#replyModal' 
       ng-click='storemsgid("+_msgid+")'><small>reply</small></a> 
      </div> "; 

注:

  • _contentは、String値を持っていると_msgidは、整数値を持っています。
  • _contentがチャットコンソールに表示されます。
  • HTMLページには、関数storemsgid(id)があり、それは動作します(問題が発生する原因ではありません:))。
  • 新しいメッセージがチャットコンソール(divタグ)に挿入され、このメッセージは独自のng-controllerを持ち、機能はstoremsgid(id)です。

私を助けてください、または私に指示してください。

おかげ

答えて

0

は、コントローラからHTMLを挿入するためにng-bind-html directiveを使用します。

<body ng-app="myApp" ng-controller="myVm as vm"> 
    <h1>Binding a click handler to AngularJS</h1> 
    <p>{{vm.rawMsg}}</p> 

    <div ng-bind-html="vm.msg"></div> 

    </body> 

JS:

app.controller("myVm", function($sce) { 
    var vm = this; 
    vm.rawMsg = '<button onclick="angular.element(this).scope().vm.alert(99)">Alert 99</button>' 
    vm.msg = $sce.trustAsHtml(vm.rawMsg); 

    vm.alert = (x) => alert(x); 
}) 

ng-bind-htmlディレクティブは、ng-clickとしてAngularJSディレクティブはコンパイルされません。

<button onclick="angular.element(this).scope().vm.alert(99)"> 
    Alert 99 
</button> 

DEMO on PLNKR:代わりにスコープ機能を呼び出すためにonclick attributeangular.elementを使用しています。

関連する問題