2015-04-08 5 views
11

Come usare ng-options.Come utilizzare ng-clic su ng-option (o altro modo per assegnare un valore)

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

voglio costruire un che utilizzano il titolo come visualizzato e quando selezionare qualcosa, popout una finestra di avviso che visualizzano il campo base. La selezione iniziale è

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

Qualcuno può aiutare?

risposta

20

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>

3

È possibile utilizzare ng-cambiamento di farlo

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

poi nel metodo di vostra onChange() nel controller che si può fare quello che vuoi che faccia :) Nel tuo caso, mostrano un avviso con il valore

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

+0

AFAICT questo non funziona – abhillman

+0

@abhillman lo fa, controlla il plunkr che ho appena aggiunto – rmuller

Problemi correlati