Quantcast
Channel: Active questions tagged html - Stack Overflow
Viewing all articles
Browse latest Browse all 72358

Trouble using ng-options to populate dropdown with vm

$
0
0

New to angularJS and having some trouble with creating a dropdown menu. My goal is to make it behave something like this: https://www.w3schools.com/angular/tryit.asp?filename=try_ng_select_selected

I'm not using $scope variables, though, so it's difficult to follow tutorials.

My HTML body:

<body ng-controller="mainController as vm">
  <p>Select a client: </p>


  <select ng-model="selectedClient" ng-options="x.name for x in vm.clients">
  </select>


  <h1>You selected: {{vm.clients.clientName}}</h1>
  <p>Their representative is: {{selectedClient.representative}}</p>

</body>

I've also tried:

<select ng-model="vm.clients" ng-options="client.name as client.representative for client in vm.clients">
  </select>

And my script.js file:

var mainModule = angular.module('app', []);

mainModule.controler("mainController", [function mainController() {
  var vm = this;

  vm.clients = [
    {"name": "Blackstone", "representative": "Emily"},
    {"name": "Skidmore College", "representative": "Sean"},
    {"name": "JP Morgan", "representative": "Steve"}
  ];


}]);

My dropdown menu remains completely empty no matter what I try. I haven't gotten to fixing the "You selected: " part because I'm still trying to figure out how to populate the dropdown.


Viewing all articles
Browse latest Browse all 72358

Trending Articles



<script src="https://jsc.adskeeper.com/r/s/rssing.com.1596347.js" async> </script>