Angularjs và UI-Chọn: làm thế nào để chọn một tùy chọn từ mã

trong angularjs tôi có một ui-select:Angularjs và UI-Chọn: làm thế nào để chọn một tùy chọn từ mã

<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>

Làm thế nào tôi có thể chọn một mục từ mã khi tôi tải trang? Khi tôi tải trang trong bộ điều khiển tôi nhận được $scope.itemsList: làm cách nào tôi có thể chọn một mục cụ thể từ controller?

Cảm ơn

Nguồn

2015-04-28 Tom

Tôi không hiểu, bạn có thể cụ thể hơn không? $ scope.itemsList là một mảng hay một đối tượng? Khi bạn tải bộ điều khiển, bạn có muốn kết buộc nó với ng-model không? – Ritesh

bạn có thể cung cấp một mục mẫu trong danh mục của bạn không? – khanmizan

Bạn có thể đặt rằng trên tải điều khiển bản thân

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>

Mã

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

Nguồn

2015-04-28 17:44:14

Các plunkr bởi @Pankaj Parkar đã không còn làm việc cho việc sử dụng dự định vì vậy tôi chia hai nó và nhận nó làm việc ở đây:

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

Những thay đổi quan trọng liên quan đến thực sự thiết lập các mục đã chọn trong điều khiển :

$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');

Việc bổ sung quan trọng là $scope.address.selected = $scope.addresses[0]; và $scope.refreshAddresses('New York, NY'); để làm cho nó đi.

Tôi cũng đã cập nhật các lựa chọn khác để chuẩn bị trước.

Nguồn

2018-03-01 23:14:43 Shovas

Angularjs và UI-Chọn: làm thế nào để chọn một tùy chọn từ mã

Trả lời

Các vấn đề liên quan