todo的一个简单应用程序，不向视图添加输入值

A simple application of todo not adding input value to view

本文关键字：视图 添加 输入 应用程序 简单 一个 todo      更新时间：2023-09-26

每次我的控制器在视图中添加新的输入但为空时，我希望它应该添加具有输入值的新输入。

<div class="container">
    <h2>My todos</h2>
    <form ng-submit="addTodo()" role="form">
        <input type="text" ng-model="todo" value="Something" placeholder="Add">
        <input type="submit" value="Add">
    </form>
    <p class="form-group" ng-repeat="todo in todos">
        <input type="text" ng-model="todo" class="form-control">
    </p>
</div>
The above code has separate temple main.html and calling that code inside index.html 
     <div ng-include="'views/main.html'" ng-controller="MainCtrl"></div>

然后每当我添加新的todo时，它都会在todo数组列表中添加空白输入和null值。但是当加载模板而不使用ng时，包括它的工作很好。

angular.module('mymailApp')
  .controller('MainCtrl', ['$scope', function ($scope) {
    $scope.todos = ['Item 1', 'Item 2', 'Item 3', 'Item 4'];
    $scope.addTodo = function(){
        $scope.todos.push($scope.todo);
        $scope.todo = "";
    };
  }]);

在左侧面板"Frameworks&Extensions"面板中将"onDomReady"更改为"no wrap-in head"

此外，在模块调用中，您希望传递第二个参数，一个包含模块所有依赖项的数组。在您的情况下，一个空数组[]

angular.module('mymailApp',[]).controller(...)

如果没有第二个参数，它假设您正在尝试扩展现有模块，而不是定义新模块。

更新了你的小提琴：http://jsfiddle.net/z2bvx2oh/11/

所以我解决了将控制器调用移动到"main.html"模板的问题，因为ng-include模板不直接调用ng-controller，它应该在模板中使用$routeProvider或controller应该被调用

修改后的代码看起来像这样：

ng controller="MainCtrl"在main.html 内移动

相关文章：