我是Angular的新手并试图解决这个问题。甚至可能有一种比我正在做的更好的方法。我愿意接受建议。
我有一个文本框,我想用它来调用服务“onChange”。
我有一个会更新的结果部分。本节使用模板。
我要做的是将js模板与Angular的结合用于代码清晰度和其他原因。
我正在使用的代码(如下所示)产生的错误类似于:
错误:[$ compile:ctreq] http://errors.angularjs.org/1.3.16/ $ compile / ctreq?p0 = ngModel& p1 = ngChange ... etc。
以下是HTML主要部分:
<div ng-controller="SLTSearchController">
<input id="searchInput" type="text" ng-change="change()" ng-model="searchInput" />
</div>
<div id="listContent"></div>
这是HTML模板:
<script id="brand-template" type="application/html-template">
<div id="listContent" ng-controller="SLTSearchController">
<div class="radioForm" ng-repeat="item in BrandNames">
<div id="tier-checkCont-{{item.BrandId}}" ng-controller="SLTSearchController">
<input name="{{item.BrandName}}" id="brand-{{item.BrandId}}" type="radio" value="{{item.BrandName}}" />
<label id="tier-label-{{item.BrandId}}" for="{{item.BrandName}}">
{{item.BrandName}}
</label>
</div>
</div>
</div>
</script>
这是JS:
var sltApp = angular.module('sltApp', []);
sltApp.controller('SLTSearchController', ['$scope', '$http', function ($scope, $http) {
//$scope.searchInput //not sure what to do with this, if anything
$scope.change = function () {
$http.get('[link to web service]').
success(function (data) {
alert('success');
$scope.BrandNames = data;
doresultswindowreplace();
}).
error(function () {
alert('fail');
});
};
}]);
function doresultswindowreplace() {
var resultstemplate = $('#brand-template').clone().html();
$('#listContent').replaceWith(resultstemplate);
}
答案 0 :(得分:2)
您必须在输入中设置ng-model才能使用ng-change,如果未定义,则会出现该错误。我使用变量名作为例子。
<input id="searchInput" type="text" ng-change="change()" ng-model="name"/>