Pair two arrays with AngularJS

I am working with two arrays and trying to compare their values using ng_if and else conditions in the following way:

var list1 = {'apple','banana','orange'};
var list2 = {'apple','pear','kiwi'};

    <div ng-repeat="item in list1">
      <div ng-if="item!=list2">
         {{ item }}
      </div>
      <div ng-else>
        <div ng-repeat="item in list2">
            {{ item }}
        </div>
      </div>
    </div>

Answer №1

It appears that ngElse is not a predefined directive, but you can achieve similar functionality by using ngIf.

Check out this link for more information.

<div ng-repeat="x in a">
  <div ng-if="b.indexOf(x) !== -1">
     {{x}} is found in b
  </div>
  <div ng-if="b.indexOf(x) === -1">
    {{x}} is not in b:
    <div ng-repeat="y in b">
        b: {{y}}
    </div>
  </div>
  <hr/>
</div>

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

Integrate Vue.js into a traditional multi-page application

I recently integrated Vue.js into my CMS-backed website to handle a specific UI feature involving tabs that switch content on the page. Now, I'm looking for a way to make these tabs deeplinkable so that a specific tab is active when the page loads. Wh ...

Developing an SQL table for a website using JavaScript

My command is not functioning as expected and I am struggling to identify the issue. The database opens successfully, however, it fails to process the table creation. var createtable2 = 'CREATE TABLE IF NOT EXISTS offlineCabinDefects (id INTEGER PRIM ...

Tips for automatically resizing a canvas to fit the content within a scrollable container?

I have integrated PDF JS into my Vue3 project to overlay a <canvas id="draw_canvas"> on the rendered pdf document. This allows me to draw rectangles programmatically over the pdf, serving as markers for specific areas. The rendering proces ...

Cookies are strangely absent from the ajax call to the web api - a puzzling issue indeed for Web Api users

Hello, here is the code I'm working with using Ajax: function GetCurrentUserId() { return $.ajax({ type: "GET", url: rootUrl + '/api/Common/CurrentDateAndUser', dataType: 'json', ...

Navigating through the Roots in ICanHaz.js / Mustache

I'm encountering a problem with iterating using ICanHaz.js / Mustache. My goal is to iterate over the roots of a JSON structure and extract a specific parameter. This is the JSON I'm working with: { "1": { "param1": "true", "param2": "fa ...

Is it possible for me to map /status and /status/:id in my web application using a combo of nodejs and angular

I'm facing some challenges with routing /status and /status/:id as I am receiving a "cannot get /status" error message. In my Angular code, I have set up the routes as follows: App.config(['$routeProvider', '$locationProvider', f ...

Node inadvertently triggers functions with similar names from a different module

Currently, I am developing a web application using Node and the Express framework. Within my project, I have organized two modules, CreateAccountService.js and LoginService.js, in the "service" directory. Each module currently only exports one function. ...

Show only the relevant content, if no matches are found then indicate this

I am currently filtering elements based on their data-attribute values and I want to show some HTML content if there are no matches found. My knowledge of JS/jQuery is limited, so I'm not sure how to achieve this. I would appreciate any guidance on ho ...

Utilizing Observable Data in Angular 4 TypeScript Components

Looking to extract and assign a JSON value obtained from an API into a variable. Here is an example: TS this.graphicService.getDatas().subscribe(datas => { this.datas = datas; console.log(datas); }); test = this.datas[0].subdimensions[0].entr ...

Loading a directive before the page loads in Vue.js

In my application, I've implemented a directive that dynamically displays buttons based on the user's role permissions: import { store } from '../store/'; import * as types from '../store/types'; const hide = vnode => { ...

Enhance data granularity in Jquery Flot by zooming in as the user interacts

I'm currently working on creating an interactive chart that allows users to zoom in for a more detailed view of the data. For instance, when viewing data over a default zoom period of 3 months, there would be one data point displayed every 24 hours. H ...

Compiling dynamic HTML injection does not appear to work

I'm currently facing a significant challenge with angularJS when it comes to using dynamically added html that includes ng-controller. Imagine I want to insert a div into the DOM that has an ng-controller attribute and displays its bound data. I can ...

Can a repetitive 'setTimeout' function invocation ultimately cause the JS Engine to crash?

Imagine a scenario where I require data from the server every 10 seconds. A function would be created to fetch the data using AJAX, and then setTimeout would be used to schedule the function to run again: function RetrieveData(){ $.ajax({ url: " ...

Using jQuery for client-side validation when the user clicks a button in an ASP.NET application

My goal is to implement field validation on button click using Jquery, but I'm facing an issue where it seems like the code behind event and the jQuery event are executing simultaneously. (UPDATED) <asp:Button ID="btnsave" runat="server" ClientI ...

Leveraging JQuery animation to manipulate the spinning of HTML jackpot

I have been using the following code to simulate a spinning wheel for users. It is functional, but I am facing an issue where the rotation stops abruptly at a specific circle before applying the style for the winning circle. My query is: Is there any way ...

Stop the HTML form from submitting via POST if it fails the client-side validation

Essentially, my issue revolves around a straightforward HTML form - upon submission, it performs a POST request to /productos and executes a JavaScript script for validation. If the form is incorrect, an error message is displayed as expected. However, I ...

Possible revised text: "Exploring methods for verifying elements within a div using Selenium

I have a situation where I need to verify elements within a div by using the following xpaths. The xpath for each item is as follows: Item 1:- //*[@id='huc-last-upsell-rows']/div[1]/div[2]/div[1]/div/div/a/img Item 2:- //*[@id='huc-last-u ...

Tips for properly encoding SQL search results so they can be decoded in JavaScript and utilized in various div containers

I have been working with a SQL database that includes a 'title' column. The function I created below is intended to be passed back through AJAX for display purposes. My goal was to retrieve the entire contents of the title column and store it in ...

Having difficulty retrieving information from Redux store

In my project, I utilize the Redux store to manage data. Through Redux-DevTools, I can observe that initially the data is null but upon refreshing the page, the data successfully populates the store. However, when attempting to retrieve this data within on ...

Tips for modifying AJAX behavior or restricting requests in Wicket

I am looking to prevent updates based on a specific JavaScript condition using AjaxSelfUpdatingTimerBehavior. WebMarkupContainer messagesWmc = new WebMarkupContainer( "messagesWmc" ) ; messagesWmc.setOutputMarkupId( true ) ; messagesWmc.add( ...