Javascript 在JSON上重复执行_Javascript_Angularjs_Json

Javascript 在JSON上重复执行

javascript angularjs json

Javascript 在JSON上重复执行,javascript,angularjs,json,Javascript,Angularjs,Json,我是新手，请纠正我的错误以下是我的JSON： newTodo = { title: "task 1", cat: "category 1", }; 同样地 newTodo = { title: "task 2", cat: "category 1", }; newTodo = { title: "task 3",

我是新手，请纠正我的错误

以下是我的JSON：

newTodo = {
            title: "task 1",
            cat: "category 1",
        };

同样地

newTodo = {
            title: "task 2",
            cat: "category 1",
        }; 


        newTodo = {
            title: "task 3",
            cat: "category 3",
        };

现在在我的HTML中，我应该如何编写如下代码：

<li ng-repeat="todo in todos">

            {{todo.title}}
            {{todo.cat}}

</li>


{{todo.title}
{{todo.cat}

但以上是错误的，我希望任务按类别显示，如：

类别1：任务列表第2类：任务列表

请帮忙。如果问题不清楚，请告诉我。

你可以这样写：

$scope.newToDo = {
            title: "task 2",
            cat: "category 1",
        };

而不是html

<li ng-repeat="todo in newToDo ">    
   {{todo.title}}
   {{todo.cat}}    
</li>


{{todo.title}
{{todo.cat}

或在表中：

<table>
    <tr ng-repeat="todo in newToDo">
    <td>{{todo.title}}:<span style="font-weight: bold"> {{todo.cat}}</span></td>
      </tr>
</table>


{{todo.title}}:{{todo.cat}

您可以将json设置为：

var allTask = [
                {
                cat: 'category 1'
                task : { title: "task 1", title: "task 2", title: "task 3"}
                },
                {
                cat: 'category 2'
                task : { title: "task 1", title: "task 2", title: "task 3"}
                }
        ]

var-app=angular.module（'myApp'，[]）；
应用程序控制器（'myCtrl'，函数（$scope）{
$scope.todos=[{
“标题”：“任务1”，
“cat”：“Cat1”
}, {
“标题”：“任务2”，
“cat”：“Cat1”
}, {
“标题”：“任务1”，
“cat”：“Cat2”
}];
var-reduced={}；
$scope.todos.map（函数（项）{
减少的[item.cat]=减少的[item.cat]| |[]；
减少[item.cat].push（item.title）；
});
$scope.reducedOutput=已减少；
});
li{
颜色：红色；
}


{{key}}
{{title}

创建一个名为todoList的组件
angular.
    module('TodoApp').
    component('todoList', {
      template:
        '<ul>' +
          '<li ng-repeat="newTodo in $ctrl.newTodos ">' +
             '<span>{{newTodo .title}}</span>' +
              '<p>{{newTodo .cat}}</p>' +
          '</li>' +
        '</ul>',
    controller: function TodoListController() {
      this.newTodos = [
      {
        title: "task 2",
        cat: "category 1"
      }, {
         title: "task 2",
        cat: "category 1"
      }
    ];
  }
});

angular。
模块（'TodoApp'）。
组件（'todoList'{
模板：
“”+
“”+
“{{newTodo.title}}”+
“{{newTodo.cat}”+
“”+
“”，
控制器：函数TodoListController（）{
此.newTodos=[
{
标题：“任务2”，
类别：“1类”
}, {
标题：“任务2”，
类别：“1类”
}
];
}
});

然后像这样创建视图文件
<body ng-app="TodoApp">      
   < todo-list></todo-list>
</body>



欢迎来到StackOverflow，Sajan！如果您想按类别ng repeat=“todo in todos order by todo.cat”排序，可能这个问题不太清楚。您需要制作和数组如下[{“title”：“task”}，{“title”：“task”}]@Sajan Nagpal:检查我的答案，并让我知道。但它显示了所有任务以及类别，如（task1，category1），（task2，category1），（任务3，类别3）…我希望它是这样的：（类别1：任务1，任务2），（类别3：任务3，任务4）正如Jigar7521所说，您必须按照他所描述的方式构造json数据。@error505他不能更改json。他仍然可以使用他的json结构，但创建json不在我的控制之下，而是由我来创建的。因此，每次遇到json时，您都可以像allTask一样推送它。推送（{title:“task 1”，title:“task 2”，标题：“任务3”}）；为什么使用指令？按功能区而不是按函数来组织代码。那么，在这些功能区中使用指令是否有错误？在哪里使用指令和不使用指令没有标准。但使用指令将简化代码。练习使用指令是一个好习惯。好的答案。投票赞成。@SajanNagpal Stackoverflow很快，但你应该LD不认为它是一个代码生成器。答案是我以前回答的一个拷贝/粘贴……你应该自己搜索一下。first@Weedoze…好的…谢谢你的帮助。