为什么ng-click不能在动态html内容中工作？

I have a web application working with angular js and it has selection to select some master data. It is working perfectly fine. My only problem is I create a dynamic button inside a table and I have attached ng-click method to that button, however, it is not working and it does not give any kind of a respone either.

我有一个使用角度js的Web应用程序,它可以选择一些主数据。它工作得非常好。我唯一的问题是我在表格中创建了一个动态按钮,并且我已经将ng-click方法附加到该按钮,但是,它不起作用,它也没有给出任何类型的响应。

ng-click='ssa' is the call and $scopr.ssa = function(){} has alert method to get a the method is called or not

ng-click ='ssa'是调用而$ scopr.ssa = function(){}有alert方法来调用方法

myApp.controller('oppController', ['$scope', function ($scope) {

        $scope.MasterSelection = [{ id: 1, name: 'Contact' }, { id: 2, name: 'Property Category' }, { id: 3, name: 'Property Features' }, { id: 4, name: 'Sale or Rent' }];

        $scope.MasterChange = function () {

            var Type = $scope.master.name;
            var Value = $scope.newtype;

            var Master = new DataAdd(Type, Value);

            $.ajax({
                url: "../api/operations/mastertables",
                type: 'POST',
                contentType: 'application/json',
                data: JSON.stringify({
                    Master: Master
                }),
                success: function (data) {
                    SetDP(data);
                },
                error: function (jqXHR, exception) {
                    alert(exception);

                }
            });
            $scope.experror = "SDsd";
        }

          $scope.ssa = function () { alert('qw');}

    function SetDP(data) {
        var tables = '<table width="60%"><col width="15%"/><col width="20%"/><col width="65%"/><tbody>';

        if (data != null) {
            for (var i = 0; i < data.length; i++) {
                tables += '<tr>';
                tables += '<td> <img style="width:40px; height:40px;" src=@Url.Content("~/Content/Images/btndelete.png") /> </td>';
                tables += '<td> <label style="font-size:x-small; color:white;">' + (i + 1) + '</label> </td>';
                tables += '<td> <label style="font-size:x-small; color:white;">' + data[i][1] + '</label> </td>';
                tables += '</tr>';
            }
        }

        tables += '<tr><td> <button style="width:80px; height:30px; font-size:15px;" ng-click="ssa();"> Add </button> </td><td></td>';
        tables += '<td> <input style="font-size:20px; width:100%;"  type="text" ng-model="newtype" /></td></tr>';
        tables += '</tbody></table>';

        $("#dvtable").html(tables);

    }

        function DataAdd(Type, Value) {
            this.Type = Type;
            this.Value = Value;
        }
    }]);

Following would be my html code

以下是我的HTML代码

<select ng-model="master" ng-options="master.name for master in MasterSelection" ng-change="MasterChange()">
      <option value="">None</option>
    </select>
      <div ng-bind-html="dvtable">

      </div>

How should I make my button clickable in angular js application? Thanks in advance

如何在角度js应用程序中单击我的按钮?提前致谢

1 个解决方案

#1

<select ng-model="master" ng-options="master.name for master in MasterSelection" ng-change="MasterChange()">
      <option value="">None</option>
</select>

<my-table>

</my-table>

//js

(function(){

myApp.directive('myTable', function(){

 return {
  restrict : 'E',
  templateUrl : 'my-table.template.html',
  link : function(scope){
    scope.ssa = function(){
      alert("HELLO");
    }
  }

  };

});


})();

//my-table.template.html

<div> <button class="btn btn-default ng-click="ssa()"> Click </button> </div>