Kuan Kuan - 4 months ago 20
AngularJS Question

How to use ng-click on ng-option( or other way to assign value)

All:

I am learning how to use ng-options.

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


I want to build a which use the title as displayed and when select something, popout a alert window which display the according field. The initial selection is

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


Could anyone help?

Thanks

Answer

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>