Question

我正在开发AngularJs中的应用程序

这是我的代码：

HTML

<div ng-controller="MainController as main" class="containerWrap">
..
..
..
<p ng-bind-html="parseMsg(msg)"></p>
..
..

parseMsg函数将用户填充的msg传递给控制器JS，定义如下：

this.parseMsg=function(msg){
...
...
    if(msg['subtype']==FILES_UPLOADING){
        $scope.showUploadOptions=true;
        var per=parseInt(msg['text']);
        if(per==100)
            msg['text']='<div ng-if="showUploadOptions"><img ng-src="logo.png"  ng-click="main.cancelFileUpload(chat,msg_id)"/></div>';
        return $sce.trustAsHtml(msg['text']);
    }
...
...
...
};

聊天和传递给main.cancelFileUpload的msg_id先前存储为：

$scope.chat = (object)
$scope.msg_id =(object) 

this.cancelFileUpload=function(chat,msg_id){
        alert("Cancel clicked ");
        delete this.retryUploadFiles[msg_id];
        delete chat.msgs[msg_id];
    };

我要做的是取消在服务器请求期间使用点击图片发送的文件上传。

此ng-click没有响应。它没有给出错误但也没有正常运行。

任何人都可以帮助确定问题吗？

谢谢！

Answer 1

ngBindHtml不要编译您的HTML。因此，动态HTML（ng-if，ng-src，ng-click等）中的所有角度指令都不起作用。

要真正编译您的HTML，您可以使用$compile服务：

$compile(html)($scope)

但对角度来说，这不是一个真正的方法。如果要修改DOM结构 - 需要使用指令。在您的情况下，您可以将html包含在模板本身中，而不是动态添加它：

<div ng-show="showYourHtml">
    <img ng-src="logo.png"
         ng-click="main.cancelFileUpload(chat,msg_id)"/>
</div>

你的控制器：

...
if(conditions){
    $scope.showYourHtml = true;
}
...

使用AngularJS调用函数

1 个答案: