Почему ngRepeat не создает упорядоченный список, как ожидалось?
Я пытаюсь создать упорядоченный список, но число перед каждым элементом списка всегда равно 1.
Часть HTML:
<ol ng-repeat = "student in student.gpas | filter: studentName | orderBy: 'gpa'">
<li>{{'Name: ' + student.name + ' GPA: ' + student.gpa}}</li>
</ol>
Часть JavaScript:
$scope.student = {
gpas: [
{ name: "a c", gpa: 3.5 },
{ name: "b c", gpa: 2.5 },
{ name: "c c", gpa: 1.5 },
{ name: "d c", gpa: 0.5 }
]
};
Результат:
Почему не работает упорядоченный список?
Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией
В JavaScript одним из самых запутанных понятий является поведение ключевого слова "this" в стрелочной и обычной функциях.
Концепция локализации и ее применение в приложениях React ⚡️
Локализация - это процесс адаптации приложения к различным языкам и культурным требованиям. Это позволяет пользователям получить опыт, соответствующий...
Улучшение производительности загрузки с помощью Google Tag Manager и атрибута Defer
В настоящее время производительность загрузки веб-сайта имеет решающее значение не только для удобства пользователей, но и для ранжирования в...
![Безумие обратных вызовов в javascript [JS]](https://i.imgur.com/WsjO6zJb.png)
Безумие обратных вызовов в javascript [JS]
Здравствуйте! Юный падаван 🚀. Присоединяйся ко мне, чтобы разобраться в одной из самых запутанных концепций, когда вы начинаете изучать мир...
Система управления парковками с использованием HTML, CSS и JavaScript
Веб-сайт по управлению парковками был создан с использованием HTML, CSS и JavaScript. Это простой сайт, ничего вычурного. Основная цель -...
JavaScript Вопросы с множественным выбором и ответы
Если вы ищете платформу, которая предоставляет вам бесплатный тест JavaScript MCQ (Multiple Choice Questions With Answers) для оценки ваших знаний,...
2
1
58
4
Перейти к ответу
Данный вопрос помечен как решенный
Ответы 4
Вместо использования ng-repeat в ol используйте его в li
<ol>
<li ng-repeat = "student in student.gpas | filter: studentName | orderBy: 'gpa'">
{{'Name: ' + student.name + ' GPA: ' + student.gpa}}
</li>
</ol>
Пытаться:
<ol>
<li ng-repeat = "student in student.gpas | filter: studentName | orderBy: 'gpa'">
{{'Name: ' + student.name + ' GPA: ' + student.gpa}}
</li>
</ol>
Пожалуйста, используйте ng-repeat внутри элемента <li>, а не в элементе <ol>. Что-то вроде этого:
<ol >
<li ng-repeat = "student in student.gpas | filter: studentName | orderBy: 'gpa'">
{{'Name: ' + student.name + ' GPA: ' + student.gpa}}</li>
</ol>
Ответ принят как подходящий
ng-repeat должен выполняться через li, а не ol
ДЕМО
angular.module('app', [])
.controller('Main', ['$scope', function($scope) {
$scope.student = {
gpas: [
{ name: "a c", gpa: 3.5 },
{ name: "b c", gpa: 2.5 },
{ name: "c c", gpa: 1.5 },
{ name: "d c", gpa: 0.5 }
]
};
}]);<!DOCTYPE html>
<html ng-app = "app">
<head>
<link rel = "stylesheet" href = "style.css" />
<script src = "https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
</head>
<body ng-controller = "Main">
<ol>
<li ng-repeat = "student in student.gpas | filter: studentName | orderBy: 'gpa'">
{{'Name: ' + student.name + ' GPA: ' + student.gpa}}
</li>
</ol>
</body>
</html>Другие вопросы по теме
Как получить индекс столбца в многоколоночном div
Как добавить семидневный разрыв между следующей и предыдущей датой
C# - Как передать входное значение html в url.Action
NgClass с несколькими условиями ложное условие не работает
HTML автоматически сопоставляет href с корнем
Отправка входных данных из HTML в скрипт Python с помощью ajax
Просмотрите папку и все ее подпапки, чтобы распечатать имена файлов
Как включить партиалы в другой частичный EJS?
Фильтровать HTML-теги из содержимого только для поиска, а не для отображения в Solr
Как мне добавить внешний файл .js в свой index.html? (VueJS2)
Похожие вопросы
Как получить индекс столбца в многоколоночном div
Чтение и запись дат из таблиц Google
Как добавить семидневный разрыв между следующей и предыдущей датой
Fetch не получает сообщение об ошибке от Node Js
Найдите, к какому элементу массива принадлежит этот текст
Дочерний запрос для каждой строки в родительском запросе - Node.js и node-mssql
Проблема перехода D3 SVG после удаления нескольких узлов
JQuery Неверный или неожиданный токен в простом коде Rails
Интеграция React с Firebase с использованием только response или node.js?
Проблемы с выполнением javascript в отладчике VScode
Изучите HTML, и вы поймете, почему