Display the length of an array using AngularJS

Hey there, I'm currently having an issue with printing a list where each entry is supposed to follow the format "element X of TOTAL". However, instead of displaying the total value, it appears as blank text. It seems like a simple mistake, but for some reason, I can't seem to pinpoint what's causing it.

<li ng-repeat="elem in lista" ng-show="check">
    Element {{elem.item}} of {{len}}
    <button ng-click="remove(elem)">Remove</button>
</li>

I also have the following code snippet from my app.js file that contains my controller:

$scope.lista = [
        { item: 'one' },
        { item: 'two' },
        { item: 'three' }
];

var len = $scope.lista.length;

Answer №1

Modify

var len = $scope.lista.lenght;

Convert to:

$scope.len = $scope.lista.length;

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

What are some possible reasons or solutions for Axios sending a 404 error?

Hi there, I'm completely new to the MERN stack and I'm encountering an issue when trying to post data using Axios and Express. I may have misunderstood something, so here's my problem. I have a form on a page that I am attempting to use to s ...

I have been utilizing ESBuild to compile JavaScript code for browser usage. However, I encountered an issue when trying to import CSS as I received an error message stating "Unexpected '.'". Can anyone provide guidance on how to resolve this issue?

I am currently developing a JavaScript notebook that operates within the browser environment. To compile my code, I have chosen to utilize ESBuild. My primary objective is to enable the handling of CSS imports such as <import 'bulma/css/bulma.css&a ...

Adding a new row with text box columns in an AngularJS UI grid: A step-by-step guide

I am completely new to AngularJS and in my current project, we are using UI Grid to display a list of records. Our main requirement is to add a new record to the UI Grid. We are also referring to the following link for assistance: If anyone can help me w ...

Error in Vue component when setting the background image URL

Here is my code snippet that sets the background image for a component: style() { return { "background-image": `url(${require(`../../../assets/images/${this .last_result}.png`)})` }; }, The expected URL should be ../../../assets/images/ ...

The password prompt window refuses to align with the center of the screen. This

I've been struggling to position the Javascript popup notification using the width, height, top, and left parameters in the window.open function. No matter what I attempt, it stubbornly remains in the top-left corner. Can someone offer some guidance o ...

Combining server-side and client-side routing in AngularJS: A comprehensive guide

Currently, I am in the process of transitioning a project to an Angular-based Single Page Application (SPA). The project is originally built using node/locomotivejs and serves templates from the server side. Due to its large size, we are converting it to A ...

Streamline AngularJS conditional statements within a loop

Is there a more efficient way to handle these conditionals in an angularjs controller loop? angular.forEach(vm.brgUniversalDataRecords, function (value) { switch(value.groupValue2) { case 1: vm.graphSwitch1 = value.groupValue3; ...

JavaScript does not recognize jsPDF

After importing the jsPDF library, I attempted to export to PDF but encountered a JavaScript error stating that jsPDF is not defined. I tried various solutions from similar posts but none of them seemed to work for me. You can find the fiddle here: https ...

Guide on implementing ng-repeat within a nested JSON structure in your Ionic app

Struggling with implementing ng-repeat in a nested json object. { "title": "Important message 01", "img": "any url image here", "authorPhoto": "http://lorempixel.com/40/40/people/4/", "author": "John Doe", "datePos ...

Instruct npm to search for the package.json within a designated directory

Imagine having a folder structure that looks like this: root |-build |-package.json |-src |-foo |-foo.csproj |-foo.cs |-bar.cs |-bin |-... |-foo.sln Now, if you change the current directory to root\src\foo\bin a ...

Top Pagination Tool for Angular Web Development

Currently, I am developing an Angular and Bootstrap application and in need of a reliable pagination plugin. Can you recommend the best one for me to use? I have experimented with a plugin available at: https://github.com/michaelbromley/angularUtils/tree/ ...

Determine the number of working days prior to a specified date in a business setting

How can I calculate X business days before a given date in JavaScript when I have an array of holidays to consider? I am currently thinking about using a while loop to iterate through the dates and checking if it is a business day by comparing it with the ...

Issue with incorporating Material UI HtmlTooltip within Material UI Select MenuItem and handling synthetic events in the select onChange method

---OBJECTIVE--- The goal is to integrate a Material UI select component with MenuItems wrapped in HtmlTooltips, providing hover information for each option in the list. For now, I'm keeping it simple as a proof of concept and plan to implement dynam ...

javascript add items to a container

I created a looping animation that features dynamic words, but I'm struggling to append all the spans into the <div id"wordcloud"></div>. Any assistance with this would be greatly appreciated. var interval = 100; var width = 800; var he ...

How can a JavaScript function communicate with a code behind method?

Currently, I am trying to implement a JavaScript function for an HTML img click event on an aspx page. Additionally, there is a server method in the code behind page that I need to call from the JavaScript function without any parameters whenever the user ...

Updating the style of different input elements using Angular's dynamic CSS properties

I am seeking guidance on the proper method for achieving a specific functionality. I have a set of buttons, and I would like the opacity of a button to increase when it is pressed. Here is the approach I have taken so far, but I have doubts about its eff ...

What is the best method to evaluate lambda functions in a functional React Component using Jest and Enzyme?

My current challenge involves creating a pulldown tab in a TDD style. I have been struggling to test if the function inside the component triggers on the button's click event. The jest logs keep showing me errors indicating that the object I'm tr ...

Combining Javascript and Django for a powerful web development solution

Having trouble setting up JS on my Django web app, despite reading through the documentation and previous queries. Using the Django dev server with the following file structure: mysite/ __init__.py MySiteDB manage.py settings.py ...

AngularJS: Trouble with ui-sref and state navigation

I've been working on a project and I'm trying to redirect the content to a page in angularjs, but I keep encountering this error: angular.js:12477 Error: Could not resolve 'dashboard.home' from state 'dashboard' This is my c ...

Searching for data within an array of objects that contain multiple key-value pairs in the form of arrays: A step-by-step guide

For instance const information = [ { companies: [ {name: 'Yuri'}, {name: 'Boeing'}, {name: 'Laser'}, ], sectors: [ {name: 'Logistic'}, {name: 'Aviati ...