角度待办事项不起作用

时间:2018-07-15 19:04:29

标签: javascript angularjs

我创建了待办事项列表。 这是我的html文件。我遇到了一个问题:任务列表未显示在屏幕上。我的错误在哪里?

[40, [194, [23, 234, 500], 57], 93, 39, [10, 333, 49]]

这是我的模块和控制器js文件

<!DOCTYPE html>
<html lang="en" ng-app="myApp">
<head>

    <meta charset="UTF-8">
    <title>Angular</title>
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.9/angular.min.js"></script>
    <script type="text/javascript" src="js/app.js"></script>
</head>
<body ng-controller="firstCtrl">
    <div>
        <h1>Добавь заданий !</h1>
        <form>
            <input type="text" name="" ng-model='tempInput'>
            <button>Add</button>
        </form>
        <div>
            <ul>
            <li ng-repeat='task is tasksArray'>{{task}}</li>
            </ul> 
        </div>
    </div>
</body>
</html>

ng-repeat不起作用。为什么?

1 个答案:

答案 0 :(得分:1)

正确的语法是 task in tasksArray 而不是 task is tasksArray

  <li ng-repeat='task in tasksArray'>{{task}}</li>
  </ul> 

演示

angular.module("myApp", [])
.controller('firstCtrl', function($scope){
    $scope.tempInput = 'тестовое задане';
    $scope.tasksArray = ['this task', 'second task'];
});
<!DOCTYPE html>
<html lang="en" ng-app="myApp">
<head>

    <meta charset="UTF-8">
    <title>Angular</title>
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.9/angular.min.js"></script>
    <script type="text/javascript" src="js/app.js"></script>
</head>
<body ng-controller="firstCtrl">
    <div>
        <h1>Добавь заданий !</h1>
        <form>
            <input type="text" name="" ng-model='tempInput'>
            <button>Add</button>
        </form>
        <div>
            <ul>
            <li ng-repeat='task in tasksArray'>{{task}}</li>
            </ul> 
        </div>
    </div>
</body>
</html>