我是angularJS的新手并且遇到了我的第一个大问题。 首先,我想创建一个列表并对其进行更新,但它不起作用。
// index.html
<form ng-controller="ListCtrl">
<div class="form-group">
<input name="listname" ng-model="listname">
<input type="button" ng-click="set()" value="add new list">
</div>
</form>
<div ng-controller="ListCtrl">
<ul>
<li ng-repeat="list in lists">
{{list.id}} - {{list.listname}}
</li>
</ul>
{{output}}
</div>
有趣的部分是resetForm(),在那里我重置了表单,但也会尝试更新$ scope.output。但无论我试图改变什么,这种输出都不会改变。
// ListCtrl
var ListApp = angular.module('ListApp', []);
ListApp.controller('ListCtrl', function ($scope) {
// add new records to database
$scope.set = function() {
$scope.createTableIfNotExists();
$scope.insertSql = 'INSERT INTO Lists (listname) VALUES (?)';
if ($scope.listname) {
$scope.db.transaction(
function (transaction) {
transaction.executeSql($scope.insertSql, [$scope.listname], resetForm);
}
);
}
};
function resetForm() {
// clear the input field
$scope.listname = "";
$scope.listForm.$setPristine();
$scope.output = 'Hello World';
$scope.$apply();
}
修改 当我尝试使用$ apply时,控制台会显示错误:
function resetForm() {
$scope.$apply(function () {
$scope.listname = "";
$scope.listForm.$setPristine();
$scope.output = 'Hello World';
});
}
错误是:
Uncaught TypeError: undefined is not a function
错误指向&#34; $ scope的开头。$ apply(函数......&#34;
编辑2: 当我在index.html中添加一个新按钮并使用ng-click调用一个函数时,我只想说
$scope.output = 'Hello World!';
然后我的观点更新。 当我使用回调来更改范围时,它只会更新。不明白这一点。我认为一切都是以angularJS连接的,特别是当我在同一个控制器中时。
编辑3: 这是plunker
答案 0 :(得分:1)
未捕获的TypeError:undefined不是函数
那是因为您拨打了$scope.apply
而不是$scope.$apply
。
尝试使用回调函数调用它:
$scope.$apply(function () {
$scope.listname = "";
$scope.listForm.$setPristine();
$scope.output = 'Hello World';
});