防止控制器故障中的文本提交

我正在運行一個簡單的示例，其中包含待辦事項列表的Angular主頁。我想阻止用戶在輸入字段爲空時提交待辦事項。問題是當我加載頁面時，我所做的第一件事是在輸入字段內單擊並按Enter鍵，然後將空白待辦事項添加到待辦事項列表中。但是，之後驗證工作。我知道還有其他方法可以做到這一點，但我想知道爲什麼存在這個錯誤以及如何解決這個問題。防止控制器故障中的文本提交

我的HTML下面

<form ng-submit="addTodo()"> 
    <input ng-model="todoText" placeholder="Add a todo here" type="text" /> 
    <input class="button" type="submit" value="add"> 
</form>

我的js文件

$scope.addTodo = function() { 
    var text = $scope.todoText; 
    if (text != "") { 
    $scope.todos.push({text:$scope.todoText, done:false}); 
    $scope.todoText = ''; 
    } 
};

來源

2012-12-28 jason328

$scope.todoText是undefined，所以它通過您的病情，然後設置爲空字符串''，基於模型的變量

要麼if (!$scope.todoText) {要麼將其初始化爲空字符串$scope.todoText = '';

在控制器：

$scope.todoText = ''; 

$scope.addTodo = function() { 
    if ($scope.todoText != "") { 
    $scope.todos.push({text:$scope.todoText, done:false}); 
    $scope.todoText = ''; 
    } 
};

來源

2012-12-28 02:47:08

一試其實，你的代碼不起作用。我認爲你的回答是有道理的，但現在我測試了它仍然是一樣的。 – jason328

聲明'$ scope.todoText'作爲變量，然後檢查if語句中的變量被證明是徒勞的，因爲錯誤依然存在。我的代碼已更新。 – jason328

設置'$ scope.todoText ='';'在你的控制器中將它初始化爲空字符串。您應該在控制器中初始化您的模型，而不是在addTodo函數中。我在 –

您是否嘗試過在輸入使用required屬性？

<input type="text" 
     ng-model="todoText" 
     required <------------- prevents submission and marks the view as invalid 
     size="30" 
     placeholder="add new todo here" />

有在http://jsfiddle.net/hbulhoes/uBXfN/

來源

2012-12-28 11:10:16 Humberto

防止控制器故障中的文本提交

回答

相關問題