AngularJS und UI-Select: Wie wählen Sie eine Option aus dem Code

in AngularJS Ich habe ein ui-select:AngularJS und UI-Select: Wie wählen Sie eine Option aus dem Code

<ui-select ng-model="itemSelected.selected" theme="selectize" ng-disabled="disabled"> 
    <ui-select-match placeholder="Select an item...">{{$select.selected.Name}}</ui-select-match> 
    <ui-select-choices repeat="item in itemsList"> 
     <span ng-bind-html="item.Name"></span> 
    </ui-select-choices> 
</ui-select>

Wie kann ich ein Element aus dem Code wählen, wenn ich die Seite laden? Wenn ich die Seite in den Controller laden, bekomme ich die $scope.itemsList: Wie kann ich einen bestimmten Artikel aus dem controller auswählen?

Dank

Quelle

2015-04-28 Tom

Ich verstehe nicht, können Sie genauer sein? ist $ scope.itemsList ein Array oder ein Objekt? Wenn Sie Ihren Controller laden, möchten Sie ihn mit ng-model binden? – Ritesh

können Sie einen Beispielartikel in Ihrer Artikelliste bereitstellen? – khanmizan

Sie können die Last auf Regler eingestellt selbst

Markup

<body ng-controller="DemoCtrl"> 
    <p>Selected: {{item.selected}}</p> 
    <ui-select ng-model="item.selected" theme="select2" ng-disabled="disabled" style="min-width: 300px;"> 
    <ui-select-match placeholder="Select a item in the list">{{$select.selected.name}}</ui-select-match> 
    <ui-select-choices repeat="item in items | propsFilter: {name: $select.search, age: $select.search}"> 
     <div ng-bind-html="item.Code | highlight: $select.search"></div> 
    </ui-select-choices> 
    </ui-select> 
</body>

-Code

app.controller('DemoCtrl', function($scope, $http) { 
    $scope.disabled = undefined; 

    $scope.clear = function() { 
    $scope.item.selected = undefined; 
    }; 

    $scope.item = {}; 
    $scope.items = [ 
    { name: 'Item1', Code: 'Code1', }, 
    { name: 'Item2', Code: 'Code3'}, 
    { name: 'Item3', Code: 'Code4'}, 
    { name: 'Item4', Code: 'Code4' }, 
    { name: 'Item5', Code: 'Code5' }, 
    ]; 

    $scope.item.selected = $scope.items[0] //here you can set the item selected 
});

Working Plunkr

Quelle

2015-04-28 17:44:14

Die plunkr von @Pankaj Parkar wurde nicht mehr für die beabsichtigte Nutzung arbeiten so gegabelt ich es und es wurde hier zu arbeiten:

http://plnkr.co/edit/Y6cdgJQ3YPq7Ncb3bT4A?p=preview

Die wichtigsten Änderungen beteiligt tatsächlich das ausgewählte Element in der Reglereinstellung :

$scope.address = {}; 
$scope.refreshAddresses = function(address) { 
    var params = {address: address, sensor: false}; 
    return $http.get(
    'http://maps.googleapis.com/maps/api/geocode/json', 
    {params: params} 
    ).then(function(response) { 
    $scope.addresses = response.data.results 
    $scope.address.selected = $scope.addresses[0]; 
    $scope.$apply(); 
    }); 
}; 
$scope.refreshAddresses('New York, NY');

Der Schlüssel zusätzlich $scope.address.selected = $scope.addresses[0]; und $scope.refreshAddresses('New York, NY'); ist es zu bekommen zu gehen.

Ich aktualisierte auch die anderen wählt, um vorzufüllen, auch.

Quelle

2018-03-01 23:14:43 Shovas

AngularJS und UI-Select: Wie wählen Sie eine Option aus dem Code

Antwort

Verwandte Themen