ng-change没有被称为angularJS

Question

我有以下HTML代码，我在运行时添加以下代码。

var html = "<select class='my-class' id='test' ng-change='onChange()'> <option value='0'>Zero</option> ... </select>";
document.getElementById("myDiv").innerHTML = html;

在我的控制器中：

$scope.onChange = function()
{
    console.log("Changed");
}

但是我的onChange方法没有被调用。

Answer 1

一个问题是，如AngularJS documentation中所述：

  

仅当输入值的更改导致将新值提交到模型时，才会评估 ngChange 表达式。请注意，此指令要求 ngModel 存在。

另一个问题是您需要使用$compile。例如：

var element = angular.element("<select class='my-class' ng-model='myModel' id='test' ng-change='onChange()'> <option value='0'>Zero</option> ... </select>");
elementCompiled = $compile(element)(scope);
parentElement.append(elementCompiled);

修改

一个例子：

.controller('Ctrl', ['$scope, $compile', function ($scope, $compile) {
    var parentElement = angular.element(document.querySelector('#parent'));
    var element = angular.element("<select class='my-class' ng-model='myModel' id='test' ng-change='onChange()'> <option value='0'>Zero</option> ... </select>");
    parentElement.append($compile(element)($scope));
}]);

<div id="parent" ng-controller="Ctrl"></div>