web-dev-qa-db-fra.com

Comment utiliser ng-click sur ng-option (ou autre façon d'attribuer une valeur)

Comment utiliser ng-options.

$scope.fieldTable = [
    { 
        filed:"text",
        title:"Global"
    },
    {
        field: "relatedentity",
        title: "Entity"
    },
    {
        field:"title",
        title:"Title"
    },
    {
        field: "content",
        title: "Content"
    }
]

Je veux en construire un qui utilise le titre tel qu'il est affiché et lorsque vous sélectionnez quelque chose, ouvrez une fenêtre d'alerte qui affiche le champ correspondant. La sélection initiale est

{ 
    filed:"text",
    title:"Global"
}

Quelqu'un peut-il aider?

15
Kuan
var app = angular.module('stack', []);

app.controller('MainCtrl', function($scope) {
  $scope.fieldTable = [{
    field: "text",
    title: "Global"
  }, {
    field: "relatedentity",
    title: "Entity"
  }, {
    field: "title",
    title: "Title"
  }, {
    field: "content",
    title: "Content"
  }];

   $scope.selected = $scope.fieldTable[0];

  $scope.hasChanged = function() {
alert($scope.selected.field);
  }
});
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>

<body ng-app="stack" ng-controller="MainCtrl">
   <select ng-options="item.title for item in fieldTable" ng-model="selected" ng-change="hasChanged()">
  </select>
</body>
22
Bazinga

Vous pouvez utiliser ng-change pour ce faire

<select ng-options="item.title as item.title for item in fieldTable track by item.title" ng-model="selected" ng-change="onChanged()">

puis dans votre méthode onChange () dans le contrôleur, vous pouvez faire ce que vous voulez qu'il fasse :) Dans votre cas, affichez une alerte avec la valeur

modifier: https://plnkr.co/edit/4csDtFVH5mKd7Xr39WtG?p=preview

3
rmuller