Angularjs 动态添加的html标记中的按钮不会调用ng click in

我试图使用ng click事件使附加html中的按钮正常工作。我在这里看到了一些解决方案，但似乎对我不起作用。可能是因为我有一个不同的情况，或者我只是不能正确使用它。我的代码如下：

fileMaintenanceCtrl.js

/// <reference path="../angular.js" />

angular.module('adminApp')
.controller('fileMaintenance', [
    '$scope', '$http', '$sce', function ($scope, $http, $sce, $compile) {

        // Adding Client

        $scope.addNewClient = function () {
            debugger;
            alert($scope.addClient.CompanyName);
        }

        // End of adding client


// This is how I get the html template            
$scope.addClient = function () {
                $http.get('/FileMaintenance/AddClient')
                    .then(function(response) {
                            var divTemplate = response.data;
                            var element = angular.element(document.getElementById('btnAddCompany'));
                            console.log(element.toString());
                            element.append(divTemplate);
                            $compile(element)($scope);
                      },
                        function(error) {
                            alert('An error occured in retrieving view. ' + error.message);
                        });
            };
        }
    ]);

---

但是如果我像这样做，我甚至无法显示我的模板html。

插入代码片段后，您应该

$compile

：

.then（函数（响应）{
var divTemplate=response.data；
var element=angular.element（document.getElementById（'btnAddCompany'）；
元素。追加（divTemplate）；
$compile（元素）（$scope）；
},

---

append（）< /代码>只附加一个字符串，当它被解析并插入DOM时，它不考虑链接到<代码> $范围>代码> .< /p>我没有确切的答案，但是控制器直接修改DOM是一个很大的不可能。您可能需要自定义指令。是的。我实际上看到了这个“指令”，问题是，I。我是angular的新手，我不想让它复杂化。我目前无法运行该程序。为什么不使用
ng if
动态包含/排除HTML内容，然后将其绑定到控制器？我同意指令可能有点难看，可能不是您的第一选择。我只是根据bu获取HTML模板t单击。如果我有两个按钮，我只需相应地更改视图。@stackquestions您需要更改您对应用程序工作方式的思考方式。不要下载HTML。下载数据，作为JSON。HTML应该静态地显示在模板中。它应该显示您下载的数据。如果您需要根据所下载的内容选择要显示的内容，请您可以下载，然后只需使用ng if或ng switch根据数据包含的内容选择要显示的内容。我已更新了代码以反映您的建议。如何将已编译的元素放置到主视图中？以前的方法是将html代码放置在变量中并将变量绑定到主视图。该变量是
$scope.Selected_view
@stackquestions，我不明白“主视图”是什么意思？这里有一个plunkr演示了上述内容，简化->对不起。我的意思是主视图中没有呈现部分视图。我在获取视图或html标记之前附加到主视图的方式是使用ng bind html=“Selected_view”。通过这种方式，我可以获得输入字段和按钮，但按钮不起作用。应用您的解决方案，我不再获得局部视图。可能它没有绑定到ng bind html=“Selected_view”谢谢！谢谢！谢谢！我现在在使用您的plnkr时看到了它。谢谢！！！！！！！！
<h1 class="text-center text-info">Add Client</h1>
<br />
<div class="row">
    <div class="col-md-6 col-md-offset-3">

        <form role="form" name="formAddClient">
            <div class="form-group">
                <label for="inputCompany">Company</label>
                <input id="inputCompany" type="text"
                       class="form-control" ng-model="addClient.CompanyName" name="CompanyName"/>
            </div>

            <div class="form-group">
                <label for="inputContactPerson">Contact Person</label>
                <input id="inputContactPerson" type="text"
                       class="form-control" ng-model="addClient.contact_person" name="ContactPerson"/>
            </div>

            <div class="form-group">
                <label for="inputEmailAddress">Email Address</label>
                <input id="inputEmailAddress" type="text"
                       class="form-control" ng-model="addClient.email_address" name="EmailAddress"/>
            </div>
        </form>

        <input type="button" id="btnAddCompany" class="btn btn-success"
               value="Add Company" ng-click="addNewClient()"/>

    </div>
</div>

<div class="active tab-pane" id="file_maintenance">
    <div>
        <a href="javascript:void(0);" ng-click="addClient()">Add Client</a>
    </div>
    <br />
    <div id="file_maintenance_view_area">
        <div ng-bind-html="chosen_view">

        </div>
    </div>
</div> <!-- End of tab file_maintenance -->

$scope.addClient = function () {
    $http.get('/FileMaintenance/AddClient')
        .then(function(response) {
            var divTemplate = response.data;
            var temp = $compile(divTemplate)($scope);
            var ele = angular.element(document.getElementById('btnAddCompany')).append(temp);
        },
            function(error) {
                alert('An error occured in retrieving view. ' + error.message);
            });
};