Implementing a Filter to Sort Text Files by Number in AngularJS

I am facing an issue with the filter in AngularJS. I am trying to display data where the condition is ordering=1 (a field in my file), but unfortunately, my code is not working.

Below is my code:

<script>
  function DanhMucController($scope, $http) {
    var url = "data/cate.txt";
    $http.get(url).success(function(response) {
      $scope.DanhMucList = response;
    });
  }
</script>

Here is my HTML file:

<div ng-app="" ng-controller="DanhMucController">
  <ul class="list-unstyled">
    <li ng-repeat="danhmuc in DanhMucList | limitTo:12">
      <a href="#">{{danhmuc.career_name }}</a>
    </li>

  </ul>
</div>

And here is my data file:

[
  {
    "career_id": "1",
    "career_name": "Cate1",
    "depended": "0",
    "ordering": "1"
  },
  {
    "career_id": "2",
    "career_name": "Cate2",
    "depended": "0",
    "ordering": "1"
  },
  {
    "career_id": "3",
    "career_name": "Cate3",
    "depended": "0",
    "ordering": "2"
  }
]

The "limitTo" only retrieves the first 12 elements. I want to specify a particular number like in SQL: select * from table1 where ordering=1 Thank you for your assistance.

Answer №1

Since the recent update, I am now equipped to respond to your inquiry. One simple fix would be:

<li ng-repeat="category in CategoryList" ng-if="category.priority == 1">
  <a href="#">{{category.name }}</a>
</li>

Alternatively,

ng-if="category.priority == '1'"

in case the value is not a whole number.

Answer №2

To filter an array in 'ng-repeat' based on the "ordering" field, you can specify the value you want, such as '1' in your case.

ng-repeat="item in itemList | filter:ordering = 1"

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

Accessing the current playback time and setting a function to trigger upon reaching the end with THREE

I have successfully implemented a method in my Three.js app for loading, playing, and analyzing audio that is compatible with both desktop and mobile devices. I must use THREE.Audio instead of HTML5 Audio Analyser, as the latter does not work on mobile dev ...

"RecognitionAudio variable missing" and "InactiveRpcError occurred" [Utilizing the Google text-to-speech API]

I have a goal I'd like to achieve. A user communicates with a web browser. The web browser records the user's voice as a WAV file using Recorder.js and sends it to a server running on Google App Engine Standard environment with Python 3.7. The ...

Ways to trigger Bootstrap modal through a PHP GET call

I have been searching for a solution to create a modal similar to this one, but I haven't found anything yet. My requirement is that when we pass true in a GET request, the modal should be displayed. Otherwise, if there is no value specified in the $ ...

Creating an extra dialogue box when a button is clicked in React

Having an issue with displaying a loading screen pop-up. I have an imported component named LoadingDialog that should render when the state property "loading" is true. When a user clicks a button on the current component, it triggers an API call that chang ...

Lumx motion not functioning properly

Exploring the world of Django, angularJS, and lumx in my website creation. Still navigating my way through this framework, especially when it comes to basic lumx functionalities. Followed the installation instructions from (using "bower install lumx"). Th ...

Transferring the value of my PHP variable to a JavaScript file

Hello everyone, <script src="../../record/recordmp3.js?id=<?php echo $_GET['id'];?>&&test_no=<?php echo $_GET['test_no'];?>"></script> <script type="text/javascript" data-my_var_1="some_val_1" data-m ...

Encountering a 404 error while attempting to unlink Satellizer OAuth

Currently, I am experimenting with the satellizer library's example in conjunction with a Laravel backend for Facebook integration. It seems that once a user connects their Facebook account to the application using satellizer, it becomes impossible to ...

Guide on incorporating text onto objects with three.js

I successfully incorporated text into my shirt model using a text geometry. Check out the code below: var canvas = document.getElementById('myCanvas'); var ctx = canvas.getContext('2d'); ctx.font = 'italic 18px Arial'; ctx.te ...

Sending an array to a component in Angular without the need for a controller

How can I pass an array to a component in Angular 1 without being inside a controller (using a component-only approach)? Currently, my starting point is: <user-list users="users"></user-list> The 'users' variable is a JavaScript arr ...

The postback event continues to trigger even if the OnClientClick function returns false

Is there a way to prevent Button1_Click from firing after a Jquery function returns false in my code snippet below? <%@ Page Language="C#" %> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1- ...

Pairing AngularJS Material with the Ionic framework

Looking to develop an app with Ionic AngularJS material components? Or perhaps using the Material Framework Design Lite for your design? ...

What is the best way to prevent handleSubmit from triggering a re-render when moved to a different

Just started experimenting with React and ran into an issue that I can't seem to find a solution for anywhere. I have a basic search form that interacts with an API. If an invalid value is returned, it displays an H3 element with an error message lik ...

Automatically adjusting the locale settings upon importing the data

Is there a way to create a dropdown menu of languages where clicking on one language will change the date format on the page to match that country's format? In my React app, I am using moment.js to achieve this. My plan is to call moment.locale( lang ...

Unable to execute node file in Visual Studio Code's terminal

My attempt to run a file using the terminal in Visual Studio Code has hit a snag. Despite my best efforts, I keep encountering an error message that reads as follows: For example, when I type "node myfile.js" into the terminal, I get the following error: ...

Be warned: Babel has detected a duplicate plugin or preset error

Currently, I am enrolled in a React course on Frontend Masters. As part of the course, we were tasked with modifying the Babel config to allow state instantiations like: state = {index: 0} in class components. However, when I executed the command: npm i ...

To access a restricted selection of images stored in Firebase

Is there a way to load additional images from Firebase by clicking a button? I created a function that looks like this: onLoadMore() { if (this.all.length > 1 ) { const lastLoadedPost = _.last(this.all); const lastLoadedPostKey = lastLoadedP ...

Angular's ng-maxlength feature will indicate that a field is invalid if it is left blank, even if it contains any characters

Currently, I am developing a dynamic form using Angular (1.3b17). In my approach, I store the form's schema in an object with various properties defining field behavior like "type" (text, textarea, check, etc) and "maxlength." Subsequently, I assign t ...

Implementing a local storage cookie service with spaces separating each word

Setting the cookie works without issues, but when I set the cookie name as "Cookie Code 1", it gets saved as "cookie%20code%201". How can I resolve this problem with spaces between words? self.cookie=function(){ localStorageService.cookie.set("Cook ...

Transform the page into a Matrix-inspired design

I decided to transform the appearance of my web pages into a stylish The Matrix theme on Google Chrome, specifically for improved readability in night mode. To achieve this goal, I embarked on the journey of developing a custom Google Chrome extension. The ...

JavaScript is throwing an error because `csv[i]` has not

When I try to import a CSV file using JavaScript, the dataset imports successfully into my program. However, I keep encountering the error csv[i] not defined (line 57). I attempted to add var i = 0; just before that line, but the error persists. Any sugg ...