YouTip LogoYouTip

Home > Angular > Ng Ng Repeat

Ng Ng Repeat

📅 2026-06-20 | 📂 Angular

-- Learning is not just about technology, but also about dreams!

Home HTML JAVASCRIPT CSS VUE REACT PYTHON3 JAVA C C++ C# AI GO SQL LINUX VS CODE BOOTSTRAP GIT Local Bookmarks

AngularJS Tutorial

AngularJS Tutorial

  • AngularJS Introduction
  • AngularJS Expressions
  • AngularJS Directives
  • AngularJS Model
  • AngularJS Scope
  • AngularJS Controllers
  • AngularJS Filters
  • AngularJS Services
  • AngularJS Http
  • AngularJS Select
  • AngularJS Tables
  • AngularJS SQL
  • AngularJS HTML DOM
  • AngularJS Events
  • AngularJS Modules
  • AngularJS Forms
  • AngularJS Input Validation
  • AngularJS API
  • AngularJS Bootstrap
  • AngularJS Includes
  • AngularJS Animations
  • AngularJS Dependency Injection
  • AngularJS Routing
  • AngularJS Application

AngularJS Examples

AngularJS Examples

AngularJS Reference Manual

AngularJS Reference Manual

AngularJS Examples

Deep Dive

  • Scripting Languages
  • Programming Languages
  • Software
  • Development Tools
  • Computer Science
  • Web Service
  • Network Services
  • Scripting
  • Programming
  • Web Design & Development

AngularJS ng-repeat Directive

AngularJS Reference Manual

AngularJS Examples

Loop Output Multiple Headings:

<body ng-app="myApp" ng-controller="myCtrl">

<h1 ng-repeat="x in records">{{x}}</h1>

<script>
var app = angular.module("myApp", []);
app.controller("myCtrl", function($scope) {
    $scope.records = [
        " 1",
        " 2",
        " 3",
        " 4",
    ]
});
</script>

</body>

Try it yourself »

Definition and Usage

The ng-repeat directive is used to loop through a specified number of HTML elements.

The collection must be an array or an object.

Syntax

<element ng-repeat="expression"></element>

All HTML elements support this directive.

Parameter Values

Value Description
expression The expression defines how to loop through the collection.

Expression Example Rules:

  • x in records
  • (key, value) in myObj
  • x in records track by $id(x)

More Examples

AngularJS Examples

Loop Output a Table Using an Array:

<table ng-controller="myCtrl" border="1">
    <tr ng-repeat="x in records">
        <td>{{x.Name}}</td>
        <td>{{x.Country}}</td>
    </tr>
</table>

<script>
var app = angular.module("myApp", []);
app.controller("myCtrl", function($scope) {
    $scope.records = [
       {
            "Name" : "Alfreds Futterkiste",
            "Country" : "Germany"
        },{
            "Name" : "Berglunds snabbköp",
            "Country" : "Sweden"
        },{
            "Name" : "Centro comercial Moctezuma",
            "Country" : "Mexico"
        },{
            "Name" : "Ernst Handel",
            "Country" : "Austria"
        }
    ]
});
</script>

Try it yourself »

Loop Output a Table Using an Object:

<table ng-controller="myCtrl" border="1">
    <tr ng-repeat="(x, y) in myObj">
        <td>{{x}}</td>
        <td>{{y}}</td>
    </tr>
</table>

<script>
var app = angular.module("myApp", []);
app.controller("myCtrl", function($scope) {
    $scope.myObj = {
        "Name" : "Alfreds Futterkiste",
        "Country" : "Germany",
        "City" : "Berlin"
    }
});
</script>

Try it yourself »

AngularJS Reference Manual

AngularJS Examples

ByteArk Coding Plan

Supports mainstream large models like Doubao, GLM, DeepSeek, Kimi, MiniMax, officially supplied, stable and reliable.

Configuration Guide

¥9.9 / Month

Activate Now

iFlytek Star Coding Plan

Includes free model call quota, DeepSeek, GLM, Kimi, MiniMax, one-stop experience and deployment platform.

Configuration Guide

¥3.9 / Month

Activate Now

Click to Share Notes

Category Navigation

  • Python / Data Science
  • AI / Intelligent Development
  • Front-end Development
  • Back-end Development
  • Databases
  • Mobile Development
  • DevOps / Engineering
  • Programming Languages
  • Computer Fundamentals
  • XML / Web Service
  • .NET
  • Website Building

Advertisement

AngularJS Tutorial

AngularJS Tutorial

  • AngularJS Introduction
  • AngularJS Expressions
  • AngularJS Directives
  • AngularJS Model
  • AngularJS Scope
  • AngularJS Controllers
  • AngularJS Filters
  • AngularJS Services
  • AngularJS Http
  • AngularJS Select
  • AngularJS Tables
  • AngularJS SQL
  • AngularJS HTML DOM
  • AngularJS Events
  • AngularJS Modules
  • AngularJS Forms
  • AngularJS Input Validation
  • AngularJS API
  • AngularJS Bootstrap
  • AngularJS Includes
  • AngularJS Animations
  • AngularJS Dependency Injection
  • AngularJS Routing
  • AngularJS Application
  • AngularJS Examples
  • AngularJS Examples
  • AngularJS Reference Manual
  • AngularJS Reference Manual

Online Examples

  • HTML Examples
  • CSS Examples
  • JavaScript Examples
  • Ajax Examples
  • jQuery Examples
  • XML Examples
  • Java Examples

Character Sets & Tools

  • HTML Character Set Settings
  • HTML ASCII Character Set
  • JS Obfuscation/Encryption
  • PNG/JPEG Image Compression
  • HTML Color Picker
  • JSON Formatter Tool
  • Random Number Generator

Latest Updates

  • AI Agent
  • AI Evaluation and Security Research
  • AI System Architecture
  • Frontier Research Trends
  • NLP Advanced Techniques
  • Computer Vision AI
  • Deep Learning Fundamentals

Site Information

  • Feedback
  • Disclaimer
  • About Us
  • Article Archive

Follow WeChat

My Bookmarks

Mark Article

Browsing History

Clear All

No Records

← Ng Ng RepeatNg Ng Paste →

📂 Categories