Using `ngModel` within `ngOptions` inside `ngRepeat`

<p><b>Customer Name</b></p>
<div ng-repeat="customer in customerList">
  <b>{{customer.name}}</b>
  <select value="Please choose a bot from the list" ng-model='???' ng-options="b as b.name for b in listOfBots" |>
  </select>
</div>
<button ng-click="(getBotSelection())">Choose Bots</button>

I have not been able to locate any resources related to this specific setup. The customerList consists of data imported from an Excel spreadsheet prompting me to make updates for customers. I require a bot to be executed for each customer, hence I am setting ng-options to bot.name in the listOfBots array.

The challenge with my search results is that they tend to focus on iterating through only one collection at a time. I am struggling to implement this particular scenario and would appreciate some guidance.

This is how the list of bots appears:

for (var i = 0; i < listOfBotsArr.length; i++) {
      listOfBotsObj.push({
        name: listOfBotsArr[i]
      });
      $scope.$apply();
  }

Answer №1

<div ng-show="showBotList">
  <p>It is required to manually select which bots to run</p>
  <p><b>Client Name</b></p>
  <div ng-repeat="client in clientList">


    <b>{{client.name}}</b>
    <select value="Please choose bot from list" ng-model="bot" ng-options="b as b.name for b in listOfBots" ng-change="getSelectedBot(this.bot.name)" |>
    </select>
  </div>
  <button ng-click="">Choose Bots</button>
</div>

My approach involved passing "this" with ng-change and examining it, revealing the object I was returning, with a property bot.name that proved useful.

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

The presence of an Angular Element within an Angular application can lead to a problematic cycle of constant reloading,

, I am encountering issues with integrating Angular Elements as plugins into my Angular application. The problem arises when building the element with "--prod" - it functions properly with "ng serve" in my development setup but causes infinite reloading wh ...

Obtain Outcome from a Nested Function in Node.js

I'm grappling with the concept of manipulating the stack in JS and hoping this exercise will provide some clarity. Currently, I'm attempting to create a function that makes a SOAP XML call, parses the data, and returns it when called. While I c ...

Rendering on the server with React: Utilizing server-side rendering to display product information with passed-in :productId parameters

Having an issue with my React app that is rendered on both the client and server (Node and Express). When someone types in the URL directly, the application crashes because it cannot parse the '1' in the URL to fetch the correct product. If a l ...

Struggling to get this bootstrap carousel up and running

I can't seem to get this bootstrap carousel to switch slides, whether I use the indicators or arrows. My other carousel works perfectly fine and I've added all necessary Bootstrap and JavaScript CDNs. I'm puzzled as to why it's not func ...

Utilizing ASP.NET MVC Kendo Grid to invoke a controller method via JavaScript

To implement a custom modal confirmation popup, I need to invoke the method .Destroy("Remove", "Attachment") from javascript. How can I trigger the Remove method in javascript? I have identified where I would like to make this call in the code snippet. Add ...

Have I got it all wrong with the way Controllers communicate with Services and how I conduct unit testing?

Currently, I am in the process of developing an AngularJS application and I want to ensure it follows best practices. When making external API calls using either $resource or $http, I always do this within a separate Service or Factory. However, I am unsur ...

Design a clear button for MUI autocomplete feature

I'm currently working on a project where I need to implement a button that clears the MUI autocomplete value and removes the data from the UI. Although I've managed to delete the data from the UI with the code provided, the onChange value remain ...

When using the android phonegap application, the screen interface may not render properly and display a patch on the keypad area when the keypad is

Whenever I tap on a textbox, the system keypad pops up. But after entering text, if I click on any link instead of pressing the Go button on the keypad, the keypad disappears but leaves behind a random area or displays the previous screen. When navigating ...

What methods can I apply to ensure the format of an input parameter is correct?

I could really use some guidance on utilizing ng-pattern. Here are the criteria I need to follow: Passwords must contain at least one non-alphanumeric character. Passwords must include at least one digit ('0'-'9'). Passwords must h ...

Issue with the gulp-babel plugin: Files within the Plugin/Preset should only export functions, not objects

I have started to integrate JavaScript 2015 (ES6) into my Ionic v1 app: package.json { "name": "test", "version": "1.0.0", "dependencies": { "@ionic-native/deeplinks": "^4.18.0", "cordova-android": "7.0.0", "cordova-android-support-gra ...

How can I pass function arguments dynamically to a nested function in Node.js?

Currently using Node 6.11.0, I am attempting to accomplish the following dynamically: const parentFunc = (arg1, arg2, arg3, arg4) => { childFunc('foo', arg1, arg2, arg3, arg4); }; I have attempted this method (without success): const pare ...

The Node.js server is failing to retrieve information from the AngularJS application

Having trouble reading data sent from an AngularJS client to the server via $http.post. Can't seem to figure out where I've made a mistake. var data = $.param({ id:$scope.user_id, }); alert(JSON.stringify(data)); $http.post('/getd ...

Using async/await in a for loop | The await keyword can only be used inside an asynchronous function

I've been attempting to execute the following code: async function verifyExistingUsers(db, users) { return new Promise((resolve, reject) => { var companies = [] for (const [index, user] of users.entries()) { let comp ...

Do specific elements of typography adjust according to the size of the window?

I'm always amazed by the creative solutions that come out of this community. So I'm reaching out to see if anyone knows a way to achieve something unique with CSS! Specifically, I'm curious if it's possible to make certain horizontal p ...

Keep the Bootstrap dropdown menu open when the search bar is in focus

I am working on a customized bootstrap dropdown menu that needs to remain open when the search bar within the Events dropdown is focused. I have managed to make it open and close on hover, but now I need it to stay open under certain conditions. Below is ...

How can we calculate mesh positions and create a new Point3D object with specified coordinates (x, y,

private void BuildVertices(double x, double y, double len) { if (len > 0.002) { mesh.Positions.Add(new Point3D(x, y + len, -len)); mesh.Positions.Add(new Point3D(x - len, y - len, -len)); mesh.Positions.Add(new Point3D(x + len, y - len, -l ...

import JavaScript script from a NPM package installation

I am facing a challenge with my server where I do not have the ability to run npm due to lack of permissions, and only have access to Apache. Currently, I am in need of a JavaScript library that is typically deployed using npm, such as https://github.com/ ...

Variations in how words are organized within a sentence

Can you help me devise an algorithm to identify all possible combinations of word groupings in a sentence without changing the order of the words? For example, for the sentence "the test case phrase," the various combinations would include: ['the te ...

Ways to delete an element from an array in MongoDB

I am a beginner in the MEAN stack development. I am currently working on implementing this and this. I have been using the $pull method, but it seems that it is not working for me. I suspect that the issue might be due to the differences in my MongoDB stru ...

update the element that acts as the divider in a web address (Angular)

Is it possible to modify the separator character used when obtaining the URL parameters with route.queryParams.subscribe? Currently, Object.keys(params) separates the parameters using "&" as the separator. Is there a way to change this to use a differe ...